You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 19 Current »

Design display hierarchy and create navigation.

Displays Navigation →  Tutorial | Concept | How-to Guide | ISA-101 |  Reference

This Tutorial Teaches you to:

  • Design display hierarchy
  • Apply HMI standards
  • Create navigation
  • Build effective layouts

Prerequisites:

1. Creating new Layout

  1. Go to Displays → Layouts
  2. Click on Insert New
    1. Layout Name: LayoutDemo
  3. Press OK button
  4. On the Panels, you will be able to see different formats, that can be edited by changing the "Edit" option.
  5. Change the Panel to Center
  6. In the table on the bottom, you can choose different displays to be under Page, Mobile, MobileLandscape (if needed, create different displays to use here)


2. Changing Layouts in Runtime

  1. In the Displays → Draw, add two buttons
  2. Double-click the first button, and under Label Text add: Startup Layout
  3. Go to Dynamics, set Actions and choose OpenLayout
  4. In Layout, type Startup
  5. Repeat the procedure for the second button, but this time, the configuration is below:
    1. Label Text: Layout Demo
    2. Layout: LayoutDemo
  6. Run the solution
  7. Click the buttons to see the layout changing





In this section...

The root page @parent could not be found in space 93Draft.



  • No labels