Design display hierarchy and create navigation.

Home → Tutorials → User Interactions Tutorial → Displays Module Tutorial → Layouts and Navigation Tutorial

This Tutorial Teaches you to:

  • Create and configure new Layouts
  • Change layouts in runtime


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 Content
  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...