Low-Code Designer > Setting up interfaces > Widget types > Element Layout / Tabs

Tabs

By using tabs, you can group associated data and divide a form into logical segments. Thus, it will be easier for a user to find information on the app form or to correctly perform a task.

To configure the widget, drag it to the canvas or click +Widget. Enter the settings in the pop-up window.

tabs 1

  • Hide single-page tabs. Check this box if you want to hide single-page tabs. You can also click on the link button on the right side of the field and select the Yes/No switch variable type. The value of the variable determines the tab visibility conditions. If a widget has two or more tabs, the option will have no effect on it.
  • Arrange horizontally. You can change the tabs layout to a horizontal instead of vertical. You can do this in two ways: check the box or click on the link button on the right side of the field and select the Yes/No switch variable.

tabs 2

  • On tab change handler. This option lets you add an event on tab change.

The Hide, Read only, HTML styles, On mouse enter handler, On mouse leave handler settings are the system widget settings. Read more about them in this article.

To finish the configuration, click Save and Publish.

Use case