Skip to main content
Skip table of contents

<TabLayout>

The following attributes can be defined for the <TabLayout> element:

AttributeDescription
background

Defines the background color.

This setting overwrites the default color of the color scheme!

Possible values:

  • Hexadecimal color value, e.g. ff5a00

    Do not use a hash in front of the color value! Do not use a shortened notation of the color value!
  • Color code from the color palette of the Web App (see Theming), e.g. A200
enabled

Activates the layout

  • Data binding (boolean) possible

Possible values: true/false or data binding expression

fontFamily

Defines the font family.

  • This attribute overrides the default font of the Web App for this layout.
  • If the attribute is defined on an element, the font family is inherited by the element's child elements, unless the child elements have the fontFamily attribute explicitly set.

Possible values:

  • MainFont: Stored main font
  • Font code from the font palette, e.g. Font04
fontSize

Defines the font size.

This attribute overrides the default font size of the Web App for this layout.

Possible values:

  • Any integer or decimal number with a dot as decimal separator, e.g. 20 ; 20.8 ; .9
  • Font size in pixels, e.g. 20px
  • Font size in points, e.g. 18pt
  • Font size compared to the font size of the parent element, e.g. .8em  or  120%
  • Keywords:  xx-Small, x-small, small, medium, large, x-large, xx-large, smaller, larger
fontStretch

Sets the width of the single characters.

This attribute overrides the default width of the characters of the Web App for this layout.

Possible values:

  • Condensed
  • Expanded
  • ExtraCondensed
  • ExtraExpanded
  • Medium
  • Normal (default)
  • SemiCondensed
  • SemiExpanded
  • UltraCondensed
  • UltraExpanded
fontStyle

Defines the font style.

This attribute overrides the default style of the characters of the Web App for this layout.

Possible values:

  • italic: italic characters
  • normal: normal characters (default)
  • oblique: italic characters (calculated)
fontWeight

Defines the font weight.

This attribute overrides the default font weight of the Web App for this layout.

Possible values:

  • Black
  • Bold
  • DemiBold
  • ExtraBlack
  • ExtraBold
  • ExtraLight
  • Heavy
  • Light
  • Medium
  • Normal (default)
  • Regular
  • SemiBold
  • Thin
  • UltraBlack
  • UltraBold
  • UltraLight
foreground

Defines a color for the foreground (texts etc.) of the layout.

This setting overwrites the default color of the color scheme!

Possible values:
  • Hexadecimal color value, e.g. ff5a00

    Do not use a hash in front of the color value!
    Do not use a shortened notation of the color value!
  • Color code from the color palette of the Web App (see Theming), e.g. A200
horizontalAlign

Direction in which the elements flow. The order of the elements corresponds to their declaration.

Possible values:

  • left (default)
  • center
  • right
selected

Defines which tab is opened if an action is executed on a tab.

Note:

This attribute works in conjunction with the name attribute for the <Tab> element. If the name attribute is not set for any of the existing <Tab> elements, selected has no effect. In the event of a name conflict, the first tab for which the name attribute is set is selected.
  • Data binding possible

Possible values: any string or data binding expression

textOverflow

Defines what happens if the layout is full.

Possible values:

  • ellipsis : Show with ...  that the text is not finished
  • hidden : Break off text, paying attention to whole words
  • wordBreak : Break off within the word
  • allow  (default): Break off text between words
title

Title of the tab layout is displayed as header.

  • Translatable
  • Data binding possible

Possible values: any string

visible

Defines if the layout is visible.

  • Data binding (boolean) possible

Possible values: true/false  or data binding expression

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.