Add custom app navigation

The App Designer can add custom menu navigation to an app. The navigation bar can be oriented horizontally across the top of the app, or vertically on the left side. The menus can have links to app boards within the app or to external websites. The navigation bar text, background, and borders can be customized.

Add navigation to an app

Edit App Studio apps in the Layout Designer.

1. On the Navigation toolbar, select Layout Designer .
2. Select an existing project.
3. From the project, select the app.
4. Select the Options menu for the app, and select Properties.
5. Select the Navigation tab.
6. From the Layout tab, select the Show Navigation checkbox.
7. Specify either Horizontal Layout or Vertical Layout to orient the app's navigation menus.
8. Add your company logo to the navigation bar, if needed.
9. Specify a title to use on the navigation bar, if needed. You can also enter a parameter for the App Title to link to the app. This is useful for supporting multilingual applications.
10. Click the Content tab.
11. Add a menu to your navigation. Repeat for multiple menus.

    You use parameters to create lin

12. Add menu items to any submenus, as necessary.
13. Configure the style of the navigation menus.
14. Click OK.

Add app navigation menus

Edit App Studio apps in the Layout Designer.

1. On the Navigation toolbar, select Layout Designer .
2. In the Layout Designer pane, in the Projects section, select an existing app.
3. Select the options menu for the app, and select Properties
4. On the App Properties page, select the Navigation tab.
5. On the Navigation tab, select the Content tab.
6. Click + Add Menu Item.
7. Select a menu item type.
   • External URL — the menu title links to an external site. Enter the name and URL.
   • App Board — the menu title links to an app board in this app. Enter the name and select an app board. You can also enter a parameter for the Menu Name to link to the app board. This is useful for supporting multilingual applications.
   • Submenu — This creates a dropdown menu. Enter the label for the menu. You will need to add items to the submenu.
8. Click Add Item.
9. Repeat steps 6 through 8 as necessary.
10. Click OK.

Add app navigation menu items

Edit App Studio apps in the Layout Designer.

1. On the Navigation toolbar, select Layout Designer .
2. In the Layout Designer pane, in the Projects section, select an existing app.
3. Select the options menu for the app, and select Properties
4. On the App Properties page, select the Navigation tab.
5. On the Navigation tab, select the Content tab.
6. From the appropriate submenu section, select + Add a submenu.
7. Select a menu item type.
   • External URL — the menu item links to an external site. Enter the name and URL.
   • App Board — the menu item links to an app board in this app. Enter the name and select an app board.
8. Click Add.
9. Repeat steps 6 through 8 as necessary.
10. Click OK.

Configure app navigation appearance

Edit App Studio apps in the Layout Designer.

1. On the Navigation toolbar, select Layout Designer .
2. In the Layout Designer pane, in the Projects section, select an existing app.
3. Select the options menu for the app, and select Properties
4. On the App Properties page, select the Navigation tab.
5. On the Navigation tab, select the Style tab.
6. Select the Background Color for the navigation bar. If you know the specific color code you need, enter it in the text box.
7. Specify the appearance of the navigation menu.
   • Background Color — Select the background color of the menu
   • Border Color — Select the color of the border around the menu.
   • Border Width — Enter the width of the border in pixels. Specifying 0 (zero) will remove the border.
   • Background Opacity — Specify the level of transparency for the menu.
8. Select the appearance of the labels on the navigation menu.
   • Font Style — Select whether the text is normal or italicized text.
   • Font Weight — Select whether the font is thin, regular, or bold weight.
   • Font Size — Enter the font size.
   • Font Color — Select the color of the text.
9. Click OK.

Add your logo to your navigation menus

Edit App Studio apps in the Layout Designer.

1. On the Navigation toolbar, select Layout Designer .
2. In the Layout Designer pane, in the Projects section, select an existing app.
3. Select the options menu for the app, and select Properties
4. On the App Properties page, select the Navigation tab.
5. On the Navigation tab, select the Image field and select an image file to display.
6. Click OK.