This page explains how to open a screen or create a new one.
Select a Screen
- From the application Home window, select Design.
- Select one of the listed screens; remember you can change the format of the list to see more names.
Screens tabs
- Palettes
- Component Categories
- Templates
- Styles
- Menus
- Images
Create
- Click the Create New to create a new screen.
- Select a screen template. This will give you pre-set layouts such as:
- full screen or popup
- basic screen layout, such as data grid or form
- desktop or mobile
- PhixFlow prompts you to:
- Enter the name and description for the screen.
- Select whether or not the screen will Opens Maximised
When selected, the screen will open "full screen" for the application user. When not selected, PhixFlow assumes the screen will be a pop-up window. It automatically selects the following options:- Always on top
- Allow user to resize
- Click Confirm.
- PhixFlow opens a new screen canvas on the left and the palette on the right.
- To add components to the screen, drag them in from the palette.
Make sure the ERD and Screen incontext screen text is OK and following the same standards
Use the palette to add components; see link
Adding Components to a Screen
For your selected template, PhixFlow displays a palette. This has all the "bits" or components you need to build a screen; See the page on how you layout a screen.
The palette has grouped items. At the top level are the most pre-built items
- Complete Forms - a full screen layout
- Form Elements - sets fo components prebuilt to make it easy to create a customised screen
If you do not want to use these, you can design your own screen. Some components are designed to be containers. These will give you distinct areas on the screen, with padding and margins so that child items look sensible.
- Tile containers - create the areas on your screen design
- You can then drag in Tiles or tile elements. These are still composites of several components.
If you want to go right back to the basic screen components and fields, use the last 2 palettes.
Ideally start with data rather than the components.
You can add components, such as fields, and bind them to data later. Fields that do not know what data to show are displayed with a broken link icon??, and those that have a data binding show the link icon??
For drag and drop highlighting
Whenever you start to drag something, PhixFlow highlights the area onto which you can drop it.
Refer to details in other pages
- Component concepts, and properties.
- Component → template → palette
- Where you can drop things - default container
- Designing with Drag-drop page
- Screen properties
- Palettes and Themes
- Styles and Formats
For how to display data see: New screen page