This page explains how to open a screen or create a new one, as well as how to add components to a screen.

Open an Existing Screen

1. Click the Design menu from the top menu

   Insert excerpt
   _screen _screen nopanel true

    or in the repository, expand your application's Screens section.
2. Double-click the desired Screen to open it.
3. PhixFlow opens the Screen in the canvas.
4. Right-click anywhere on the Screen to open the pop-up context menu and select 

   Insert excerpt
   _layout_unlock _layout_unlock nopanel true

   .
5. PhixFlow displays the toolbar for the screen indicating it is ready to edit.
6. Click 

   Insert excerpt
   _palette _palette nopanel true

    to display the palette on the right and you can begin editing the screen.

Add a New Screen

1. Click the Design menu from the top menu

   Insert excerpt
   _screen _screen nopanel true

    or in the repository, expand your application's Screens section.
2. Click 

   Insert excerpt
   _add _add nopanel true

   , PhixFlow opens the properties for a new Screen.  
3. Enter a Name for the screen.
4. Specify the setup for the screen, such as should the screen open maximised or as a floating pop-up. These can be changed at a later time by accessing the screen's properties from the toolbar.
5. Here are some example setups: 
   • Pop-up screen for data entry: 
     
     • tick Always on top
     • tick Allow user to resize
     • Set Position to Floating and if desired set the other positional settings such as the size and location of the screen. 
   • Full-screen properties for displaying tables of data
     • tick Open Maximised
     • untick Always On Top
     • if you intend to make your own navigation or screen controls, untick Show Window Button Bar.
     • optionally, untick Allow user to resize
6. (Recommended) Scroll down to the Description section and add a useful description.
7. In the properties toolbar, click

   Insert excerpt
   _finish _finish nopanel true

   .
8. PhixFlow opens a new, unlocked, Screen canvas on the left.
9. In the toolbar click 

   Insert excerpt
   _palette _palette nopanel true

    to display the palette on the right and begin editing.

Unlocking and locking a Screen for Editing

Locking a screen will make it uneditable and while it remains locked it displays the screen content as the end user will experience it. For example clicking a button will trigger its action, and components such as a URL component will display their content. Unlocking a screen will make it editable again and allow you to update the layout, clicking a button now will open its properties editor.

To Unlock the canvas, right-click on the canvas and select

To Lock the canvas, from the screen toolbar click on 

Design Mode and Application Mode

When creating and editing applications we work in Design Mode. This provides you access to all the tools and options necessary to create powerful applications. To experience your application as the end user will, we switch to App Mode.

The option to toggle between modes is available in the top right corner of PhixFlow,

Testing Screens

To test an application screen, click