Configure a navigation panel

Configure a navigation panel by referencing panel objects as tabs.
  1. In
    Project view
    , in
    UI
    , right-click a container and select
    New
    Containers
    Navigation panel
    .
  2. In
    Project view
    , double-click the navigation panel.
    Navigation panel displays in the editor.
  3. Create
    Panel
     types that you want to reference as tabs in the navigation panel.
    For more information, see Create a graphic object type.
  4. From
    Project view
    , drag the panel types onto the navigation panel in the editor.
    As you drop panel types onto the navigation panel in the editor, the preview of the first panel and navigation tabs display. In
    Properties
    ,
    Panel
     populates automatically.
  5. (optional) In
    Properties
    , create a dynamic link between
    Current tab index
     and the application logic that governs the currently selected tab.
    For more information about dynamic links, see Create dynamic links.
    TIP: The tab index starts with and defaults to 0. The 0 index value indicates the first tab.
  6. (optional) In
    Properties
    , under
    Panel#
    , set properties for each navigation panel tab:
    • Title
      . Title of the navigation panel tab.
    • Image path
      . Path to the image that overrides the panel title. For seamless integration of the image with the UI, use correctly sized flat images with a transparent background.
    • Enabled
      . Allows interaction with the tab on the device. Defaults to True.
    • Visible
      . Makes the tab visible. Defaults to True.
  7. (optional) In
    Properties
    , in
    Attached panel loader
    , create a dynamic link to the panel loader to attach.
    For more information about dynamic links, see Create dynamic links.
    TIP: Attaching a panel loader displays the contents of navigation panel tabs in the panel loader.
  8. (optional) Under
    Appearance
    , set the panel properties:
    • Visible
      . Makes the panel visible. Defaults to True.
    • Enabled
      . Allows interaction with the panel on the device. Defaults to True.
    • Opacity
      . Sets the opacity of the panel. Defaults to 100, which means no opacity.
    • Rotation
      . Rotates the panel around its center point. Positive values rotate the panel clockwise.
    • Move target
      . Makes the panel movable at runtime. For more information, see Make a graphic object movable.
    • Tab position
      . Determines the position of panel tabs or hides the tabs.
    • Tab width
      . Tab width in pixels.
    • Tab height
      . Tab height in pixels.
    • Appearance
      . Navigation panel appearance.
    • Style
      . Navigation panel graphic style. For more information, see Style sheets.
Provide Feedback
Have questions or feedback about this documentation? Please submit your feedback here.