Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
The tab container, formerly the container object, has many new features that allow developers to style the container tabs. In this blog, I will review some of these new features but first let’s do a quick review of what the tab container is and how you can use it. The tab container can be used to show many visualizations, one at a time, thus using less space on a sheet. It is ideal when there is the need to have many visualizations on a single sheet but not quite enough space to display them all. When using a tab container, tabs or menu items are selected to navigate through the visualizations. Tabs and visualizations can also be displayed based on a variable or the user’s access. Below is an example from the What’s New app.
There are many ways a visualization can be added to a container object. A visualization on the sheet or a master visualization can be dragged and dropped onto the tab container object, or a chart can be added from the content section of the tab container. When tabs are toggled on, a tab will exist for each visualization in the tab container.
Some of the new features of the tab container are around the tabs. For example, the font, font size, width, alignment and color for each tab can now be set by the developer. Here are the style settings for the KPI chart tab (Tab container > Content > KPI object > Styling > Tab).
Notice that the width of the tab can be set based on a percentage or pixels. This allows the developer to make accommodations for larger tab labels that may need more width to be fully visible. The background color can be set to a single color, or an expression can be used. This can be done for each tab in the tab container object. Each tab can also have a different font type and/or font size, if desired, although a consistent look and feel (font type and font size) among all tabs is ideal. Note that when the orientation of the tabs is vertical, the width of the tab cannot be set. These styles can also be applied from the styling section of the tab container (Tab container > Appearance > Presentation > Styling > Tabs). Applying a background color here, will apply it to the entire object and all tabs. From here you can also set the table label alignment to left, center or right.
Another new feature is the orientation of the tab container tabs can now be vertical. Notice in the image below how the top chart shows just the icons of the tab, and the bottom chart shows just the labels. Both are neat and clean.
When there are many tabs in a tab container, you may consider showing the menu. This is helpful when all tabs are not visible without scrolling. It provides another way to navigate the tab container.
The added tab container features allow developers to easily style the object so that it fits in better with the theme/style of the sheet it is on. This is a welcomed new feature.
Thanks,
Jennell
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.