Creating new layout

After you have created layout views, you can use them in the layouts:

1. Select Layouts in the Project Window

2. Click on the Add Layout icon

3. Enter the name and description and click on Add

Add layout

After creating a new layout, double-click on it to fill in its properties:


For each section, you can select a corresponding Layout View. After you have selected a required view, do not forget to check the Enabled box to activate it.

Options for each section:

  • Spacing – creates spaces betweenthe sections; defined in pixels
  • Enabled – checkbox for enabling particular sections
  • Scaled – scales the section accordingly to the rest
  • Sliding – hides the section, i.e. the user can open it by clicking on the tab in the center

Overlay Section #

In this section, you can put one or more layout views above existing ones. This can be useful for showing messages or images tied to a visibility animation – instead of copying these messages or images into all views, you just add them to a layout view and use it as an overlay for all of the views.

Using Layouts in Views #

Select the view you want to apply a layout to and select Layout from the drop-down menu in the Properties window.

properties window

Layout Views Example #

In the following example, we will show you how to add a permanent menu above the views, how to show a message over the views, and how to show a sliding left side menu.

1. Create View1 and View2 in your project.


2. Create a horizontal view in Layout views; it will be used for our top menu. Now add buttons “View1.” “View2,” and “Overlay.”


3. On the button “View1” add the open action to open view1. Do the same for the other button.


4. Now create the left side view in Layout Views. Again, add two buttons to it. Create them the same way as you did in the menu view.

5. Now create the overlay view in Layout Views. Make it the same resolution as your views. Add a text message to this view. Set the visibility animation for the text message.

overlay view

6. Now create your layout. For the top section, select the menu view. For the left section, select the left side view and check the sliding check box to add the overlay menu.

overlay menu

6. Now, test your view.

test your view