This page explains how to add a custom menu bar to your application, to provide navigation and options for the application user.
Overview
You can add navigation or actions to individual screens by adding components. To add menu that appears on every screen you can:
- Create a custom application menu bar. In the screen toolbar, select App Menu.
- There can be several application menus.
- An application menu is configured as a screen. It is set to Open on Startup, so is always present.
- It can be positioned in different places on the screen.
- Legacy method: To add an application menu in PhixFlow versions earlier than 9.0.0, set the menu property → Default menu. In version 9.0.0 the option has moved to the application properties.
- There is only one default menu.
- You cannot customise the styling.
- The position is fixed at the top of the screen.
Create a Custom Menu
- Click
Add menu bar to create a new screen. - In the pop-up menu, select the location for the menu bar.
- Select a blank menu or a template. Menu's are set to Open on Startup automatically.
- PhixFlow prompts you to enter the name and description for the menu bar.
- Specify the the dimensions of the menu bar in percentages or pixel's. For example:
vertical dimensions:
width: 100%
height: 50px
horizontal dimensions
width: 200px
height: 100%
- Click Confirm.
- PhixFlow opens a new screen canvas on the left and the palette on the right.
Adding Menu Options
To add a top-level menu option that will open a screen:
- Open the repository to show the list of screens.
- Drag a screen-name from the repository onto the menu bar.
- PhixFlow prompts you to add the Display Name text you want to appear in the menu. By default, the text is the screen's name.
- PhixFlow adds the menu option and automatically creates the actionflow.
When a user clicks the option, the screen opens automatically.
Use the Menu properties to configure more complex menus, for example, nested menus or options that run an actionflow.