Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Tabs are user interface components that render and display subsections to users; they arrange content into categories for easy access and make your apps look cleaner by saving space. Instead of a single title bar, a tabbed window may include multiple tabs along the top.

This component varies from the regular 'tabs' component, with the tabs arranged on the top in a horizontal space.

...

Tabs allow you to switch between options in a program, separate documents, or web pages. The currently-selected tab is usually gets highlighted (in a bold format) than the other tabs. The interface is designed to resemble the tabs at the top of file folders, as viewed from inside a file cabinet.

Tabs allow you to load multiple websites and quickly switch between them, without each of them needing a separate window.

To create a new tab in page layout, you can click the "+" sign of the current tab to open a new blank one tab.

Each open tab can be closed individually by clicking the "X" on the right side of the tab. If the tab does not show an "X," try hovering the mouse pointer over the tab.

Tabs may be easier for users to understand and associate with their contents. They are best suited for a small number of items, but provide scrolling on overflow. Tabs display scroll buttons to aid with scrolling when their contents overflow. The buttons show that there are more tabs to either side.

...

Overview

  • The Tabs is a container and represents the list of a Tab

  • The Tabs component is used for grouping the related content in a single container

  • When you add multiple tabs, the tab label is displayed horizontally on the top in the Tabs component

  • If you click on the label of the Tab, related tabs content is displayed on the bottom side

  • All components except the Navigation Node can be added to the Tabs

Attributes

Default Tab

  • You can select a Tab that will be displayed as the Default Tab

  • When the layout is rendered the Default Tab will be displayed on the Tabs

  • e.g. You have three tabs Personal Details, Educational Details, and Address Details and you set a default tab 1 then you can land on the Educational Details tab when you open the form

...

Limit

  • Limit let you to decide the number of tabs you want to display

  • If the Tab limit exceeds the entered value, then remaining tabs will be appearing in drop down list format

  • If you enter the value for example 4 then it will display four tabs and if you added above four tabs, then it will display the fifth tab in the drop-down list format

    Image Added