Tab widget allows you to add multiple widgets in a single tab and multiple tabs within a single widget. It groups number of widgets in one place which reduces the large design area of the dashboard.
You can drag and drop tab widget into the dashboard which is present under the Miscellaneous
group in the left side item panel. Also, you can resize the dragged widget to add more widgets in the same tab.
You can add multiple widgets in tabs using following three ways:
Configure tab widget by dragging some other widgets from the item panel. Assign required data to configure widgets.
Drag the configured widgets from design canvas into the tab widget.
Drag the existing panel widgets into the tab widget.
Tab can be add or remove by using following options:
Tab widget contains (+) icon at the right of last tab name. Click add icon and a new tab will be created.
Every tab is created with close icon at the right end of tab name. A tab can be removed by clicking close icon.
You can format the tab widget for better illustration of the view that you require using the settings available in Properties tab.
Tab Order helps to rearrange the created order of all tabs. Choose any one of the tab name and then click corresponding arrow icon wherever the tab get placed either upwards or downwards.
After clicking arrow icon, the selected tab will be switched as shown in following image.
A tab name can be renamed by clicking the edit icon
at the top right of the Tab Order
section. Follow these steps to edit tab name:
Select tab name.
Click edit icon at the right side of Tab Order
section.
Text box appears for the selected tab name.
Rename the tab name as shown in following image.
Widget Order rearrange the number of widgets within a tab. You can overlap the widgets over one another in a tab. The order of the widgets can be changed by Widget Order
section in property panel.
Widget Order
listed the number of widgets inside a tab. You can rearrange the order by using arrow icons.
For example, the last dragged Department
widget was placed at the bottom of the list and bound over the Feedback Report
widget. Now select Feedback Report
tab in the Widget Order
section and then click the downward arrow icon which has to be shown in the following image.
After clicking downward arrow icon, Feedback Report
tab moves to bottom of the list and it appears over the Department
widget within a Patient Feedback
tab in tab widget.
When the Hide Tab Header
checkbox is enabled, the tab header will be disabled.
The color of the tab header can be changed by choosing color from Header Color
and size of the tab font can be changed by selecting the HeaderFontsize
option.
Active Tab
sets the selected tab as default when the dashboard is rendered.
On enabling Auto Padding, the padding of the widget container will be adjusted automatically if the size of the widget varies.
Padding
This allows you to customize the padding of the widget container if the Auto Padding is disabled. Value can be between 0 and 25.
This allows you to toggle the visibility of the border
surrounding the widget.
This allows you to apply the specified radius to the widget corners if the Show Border is enabled. Value can be between 0 and 10.
This allows to set the background image for the tab widget.
This allows to set the background color to the tab widget.
This property allows you to specifies the transparency for the background color.
This allows you to toggle the visibility of the shadow
surrounding the widget.
Export tab widget as Image and PDF format. Currently, active tab with widgets will get exported.
Inter widget linking support helps to link a few widgets(master widget) with a tab widget and switch the tabs in the tab widget based on the selected index value of the master widget. It also filters the data inside the tab widget at the same time the required tab is also switched. For Example, When selecting the second value from a combo box, the second value is filtered inside the tab widget, and also the second tab is switched.
NOTE: The supported master widgets for linking with a tab widget are Combo Box, List Box, KPI Card, Number Card and Radial Gauge.
The tab widget can be configured with Inter Widget Linking support by using the following steps:
List Box,
KPI Card,
Number Card,
Radial Gauge) and configure data.
2. Drag and drop the Tab Widget and configure it with widget data.
3. Open the master widget’s property panel and find the Inter Widget Linking
section.
This allows you to enable the inter widget linking support for the tab widget. By default, the Enable
checkbox is maintained in an unchecked state.
The widgets section displays the list of tab widgets. You can choose the required tab widget for inter widget linking by enabling the Enable
checkbox.
There are two actions to configure the linking with the tab widget. When hovering over the Info
icon, it displays the message about the following actions:
The above actions are initially disabled and will be enabled by selecting any of the tab widgets under the Widgets
section.
The Default
action allows you to switch the tabs based on the selected index from the master widget. For example, when selecting the third value from the master widget, the third tab is switched in the tab widget.
NOTE: If the selected index value is greater than tab count, the last tab will be switched.
This allows you to switch the tab based on the specific index which can be entered in the text box under the Custom
action. The textbox appears only by choosing the Custom
action. This action switches to configured tab only, even choosing any value from the master widget. For example, enter a value 1
in the custom text box, then the first tab is switched only even selecting any other values in the combo box.