Selecting a Gridview Layout

About this task

Gridview layout options are available when creating a new app, form, or page. In each case, the options for dividing the viewable space are the same.

Note: When creating a new app, the Gridview layout applies to the default page.
Note: You can not place a Gridview layout within another Gridview layout.

Procedure

  1. From the dialog window for a new app, form, or page, select from the available options to divide its workspace.
    Gridview options
    Notice: For the available Gridview / Page Layouts options, you can later change all except the No Grid option. If you choose No Grid and decide later you want to change the layout, use the Layout Widget.
  2. Complete the required fields for the app, form, or page. Select Save and Continue if this is a new app or Add if you are adding a new page or form.
  3. Open the page or form that has the Gridview layout.
  4. Enter an ID and Name for the Gridview layout, or keep the defaults.
  5. From the Container section, adjust its properties as required:
    Table 1. Gridview Container Properties
    Presets

    Sets the number and arrangement of the panels.
    Show Border On Device Turn on to make the grid's borders visible during runtime.
    Layout Move the internal borders of the Gridview layout to suit the contents and requirements of each area.
    Fill Select a background fill option for the Gridview:
    • Background color icon Color—Select a color from the Color palette to use as the grid's background.
    • Background image icon Image—Select Upload Image to import a graphic as the grid's background. From Scale, select a display option for the image:
      • Fit
      • Fill
      • Stretch
      • Tile
      • Center

    Select Reset to remove all background choices.
  6. Optional: Add a visibility rule.
    Use visibility rules to control when the Gridview is visible to the app user. For example, you can create a condition that the Gridview only appears after the app user fills in a field or submits a form.
    1. Select Visibility Rule to open the Set Visibility Rule dialog box.
    2. Select whether the visibility rule requires meeting all or any conditions.
    3. From the Field list, select an app field or variable and an operator. Enter the value required for the Gridview to be visible.
    4. Select Add Condition to add another condition.
    5. Select Save.
  7. Move to the Format tab to customize the Gridview's appearance.
  8. Select Save in the SOTI Snap banner to apply your changes.
    Save app button

Results

The Gridview is configure for use as required.
Tip: Select Preview to see how the Gridview appears in your app.

What to do next

Add button or image widgets to the Gridview layout and configure their On Click events to update its contents. See Example: Setting up and Using a Gridview Layout to get started.