The View Navigation widget provides tabs for end users to access the views in a Section widget. As users access the views in the section, only the content in the section refreshes instead of the entire page, providing better app performance.
Example
Use this widget to support app design requirements such as the following:
- You create multiple views of similar content in a Section widget to avoid too much scrolling in your app. Include a View Navigation widget so users can click tabs to refresh the section content and access the views.
Usage notes
The page must have a Section widget to which you can link the View Navigation widget. You must position the widget outside the section; you cannot nest the View Navigation widget in its corresponding Section widget. For example, position the widget above or below a section (ideal for horizontal tabs) or at the left or right of a section (ideal for vertical tabs).
You can include all the section's views or specific views. To specify the sequence of the views, open the Section widget's configuration panel and drag the views in the order you want them to appear in the View Navigation widget. You can also edit the view names in the Section widget’s settings.
Settings
The View Navigation widget includes the following settings:
- Link to—Choose a section widget from the page.
- Views—Define the views to show in the widget by selecting one of the following options:
- Auto—Include tabs for all the views in the section.
- Custom—Include tabs for specific views in the section.
- Style—Select from the tab design options: Default, Underline, or Pills.
- Direction—Display the tabs horizontally or vertically.
- Background—Change the background color of the widget.
- States—Change the appearance of the tabs to provide users a visual cue when they hover over or select a tab. For example, change the text and border colors for the Selected state.
Tip:
To experiment with these options, click Live view on the builder toolbar.