Pages & Navigation

Pages are the individual views or screens that organize your application's functionality. Heisenware uses a hierarchy of pages and sub-pages to keep your app structured and easy to navigate.

Managing your app structure

You can manage the structure of your app via the pages panel. Click on the navigator icon () on the left panel to open it.

Page types

• Pages: These are your top-level screens. By default, they are automatically added to the app’s main navigation menu.

• Subpages: These are nested under a main page. They do not show up in the main navigation menu automatically. They are typically used for detail views, settings, or pop-up style content that you want to link to manually.

Creating, deleting, and organizing pages

• Add/Duplicate: Right-click any page in the panel to create a new page, a subpage, or to duplicate an existing page to save time.

• Delete: Right-click any page in the panel and click delete. Note that the first page in your app cannot be deleted.

• Change order: To change the order of pages and how they appear in the app's main menu, refer to the navigation settings.

If you need more vertical space, refer to page height settings as part of the UI Builder toolbar.

In-app navigation

The app has a navigation menu that users can click. However, page switches can also be triggered by logic and clicks on widgets. By default, apps just have bottom tabs.

Default navigation: Bottom tabs

Main navigation menu

This is the standard menu that appears across all pages and subpages.

• Configuration: Click the navigator icon () in the top bar to open the settings.

• Menu types: You can choose between:

  • None: No navigation menu.

  • Bottom tabs: (Default) A fixed tab bar at the bottom of the screen.

  • Menu drawer: A classic "burger" menu. You can set its position (top or left) and its behavior (push or overlap).

  • Top bar: Displays only the App Bar Title at the top with no menu icons.

  • Top bar and bottom tabs: Combines both for a standard mobile app feel.

• The "App Bar" behavior: Subpages automatically inherit the same App Bar Title as their parent page, ensuring the user knows which section they are currently in.

• Customization: In the settings, you can hide specific pages from the menu, edit their display labels, or assign them unique icons.

• Page order: Use the arrow icons () in the routes menu to reorder pages and define how they appear in the navigation.

Widget links

You can turn any button or icon into a page switch trigger.

• How to link: Simply drag a page from the pages panel and drop it directly onto a button or icon on your UI canvas.

• Use case: This is the primary way to let users open subpages (e.g., clicking a "Machine Details" button to open that specific detail view) or navigate in apps without a main menu.

Logic-driven navigation

Page switching can also be triggered automatically by your backend logic.

• How to link: Drag a page from the pages panel onto a function's output.

• Use case: If a function detects an error or a successful form submission, the backend can "push" the user to an error or success page automatically.