TabContainer

The TabContainer widget contains one or more tab panes where widgets are placed. It has multiple panes, but shows only one pane at a time.


  • UI Type:

Extends: BaseWidget

Properties

Name Desciption
Disable HotKeysPrevent the widget from being controlled using keyboard hot-keys.
DisabledThe widget cannot be used.
HiddenHides the widget from the user.
Hide Menu
MaximizeSet this widget to be maximized (take up all available space).
Menu Placement
Tab IndexThe Tab Index is an integer that tells the order of the widget when using the tab-key to move from one widget to another.

Style

Name Desciption
Active tab background
Active tab border color
Active tab hover background
Active tab hover border color
Active tab hover text color
Active tab text colorThe text color of the active tab.
Background-colorChange background color of the widget.
ColorColor of the text inside the widgets. May not apply to all text inside all widgets.
Condense tab pill spacingEnable to compress the size of the tab navigation panel.
Font SizeSet the font size in pixels for text.
Tab hover background
Tab hover border color
Tab hover text color
Tab spacingGenerate space between each tab item in the tab navigation panel.
Tab styleChoose the tab style between block, bordered or rounded tabs.
Text TransformLower case, Upper case and Capitalize. Regardless of how its entered in widget editor.
Text-alignmentSet left, centered or right. Applies both to icon and text.
Transparent tab backgroundEnable to make the tab panel transparent.

Events

Name Description Event Attribute
Blur Event when a widget goes out of focus.
event The event that gets triggered when the user "leaves" an element.
Click Event that triggers based on touch or click.
event The event that triggered the handler.
DblClick Event that triggers based on double click.
event The event that triggered the handler.
Focus Event when indicating/ highlighting widget using the cursor.
event Focus is the event that gets triggered when a user makes an element come into focus, by clicking on it.
TabChange Event triggered when a tab is changed or switched from one tab to another.
event Object with the selected tabs name (event.tab).

Function

getTabIndex ( )

destroyDynamicWidgets ( )

disableTab ( id: String )

Disables a tab.

Parameters
Name Type Description
id String The id of the tab.

enableTab ( id: String )

Enables a tab.

Parameters
Name Type Description
id String The id of the tab.

getActiveTab ( ) →{ Tab }

Returns the currently selected tab.

Returns

The currently selected tab.

getActiveTabId ( ) →{ Tab }

Returns the widget-ID of the currently selected tab

Returns

The currently selected tab.

hideTab ( id: String )

Hides a tab.

Parameters
Name Type Description
id String The id of the tab.

setTab ( tab: Tab )

Sets the currently selected tab.

Parameters
Name Type Description
tab Tab The tab to select.

setTabDecoration ( id: String , decoration: String )

Set the decoration of a tab

Parameters
Name Type Description
id String id Id of the tab to set decoration of
decoration String decoration

showTab ( id: String )

Shows hidden tab.

Parameters
Name Type Description
id String The id of the tab.

blur ( )

Triggers the blur event.

focus ( )

Triggers the focus event.

get ( name: String ) →{ Object }

Gets the value of the specified property.

Parameters
Name Type Description
name String The name of the property.
Returns

The property's value.

getId ( ) →{ ID }

Returns the ID of the widget.

Returns

The ID of the widget

getValue ( ) →{ Object }

Returns the widget's value.

Returns

The widget's value.

hide ( )

Hides the widget.

isEnabled ( ) →{ Boolean }

Returns true if the widget is enabled.

Returns

True if enabled, otherwise false.

isHidden ( ) →{ Boolean }

Returns true if the widget is hidden.

Returns

True if hidden, otherwise false.

set ( name: String , value: Object )

Sets the value of the specified property.

Parameters
Name Type Description
name String The name of the property.
value Object The new value.

setEnabled ( Enabled: Boolean )

Enables/disables the widget.

Parameters
Name Type Description
Enabled Boolean True to enable the widget, false to disable.

setStyle ( Object: Object )

Set the widget-style

Parameters
Name Type Description
Object Object properties

setValue ( value: Object )

Sets the widget's value.

Parameters
Name Type Description
value Object The new value.

show ( )

Shows the widget.

Other Widgets