View element

Definition

Views are the base layer for designing content in a native mobile app. Unlike pages in a web app, views do not use URLs. You navigate between them using mobile-native navigation methods such as tabs, stacks, and modals.

Key Concepts

  • Views act as screens within your app.

  • You can manage views from the pages dropdown in the editor.

  • Navigation between views is handled through actions and the tab bar, not through URL changes.

View Types

You can assign a type to each view. This defines how the view behaves:

View Type
Description

Scrollable

The default view type. Allows vertical scrolling.

Non-scrollable

A fixed-height view. Content is limited to the screen size.

Vertical list

A scrollable list of repeating content.

Section list

A grouped list (e.g., contacts grouped by first letter).

Switching to or from a list-type view will temporarily remove the existing elements on the view. These will return if you switch back.

View Properties

Each view can hold custom properties that are accessible from workflows.

Property Type
Use

Dynamic value

Can hold any data type or thing.

Color picker

Accepts hex codes or saved color variables.

Checkbox

A yes/no value (true/false).

Use the Set current view's property action to assign values to a view’s property.

Appearance Settings

You can control how views render visually on different devices.

  • Show top app bar: Adds a navigation header at the top.

  • Show tab bar: Adds a bottom navigation bar (automatically enabled when the view is a tab item).

  • Safe area: Adds padding to avoid device notches and screen edges.

  • Show status bar: Toggles the device's native status bar (time, battery, etc.).

  • Include as tab item: Adds this view to the tab bar for navigation.

Tab Bar Behavior

When a view is included as a tab item, it becomes part of the global tab navigation system. Each tab item must reference a unique view.

Adding and Editing Views

  • Create and manage views from the .

  • Set a view as a tab item using the checkbox in the view’s settings.

  • You can add new tab items via the tab bar editor and link them to existing or new views.

Best Practices

  • Views should represent logical screens (e.g., Home, Profile, Settings).

  • Use stack navigation (Go to view) for contextual screens (e.g., opening a playlist).

  • Keep the tab bar visible to indicate navigation context, even when not on a tab item.

Last updated

Was this helpful?