TabBarTheme

Customizes the appearance of TabBar control across the app.

Properties

• divider_color(ColorValue | None) –

  Overrides the default value for

• divider_height(Number | None) –

  Overrides the default value for

• indicator(UnderlineTabIndicator | None) –

  Overrides the default value for

• indicator_animation(TabIndicatorAnimation | None) –

  Overrides the default value for

• indicator_color(ColorValue | None) –

  Overrides the default value for

• indicator_size(TabBarIndicatorSize | None) –

  Overrides the default value for

• label_color(ColorValue | None) –

  Overrides the default value for

• label_padding(PaddingValue | None) –

  Overrides the default value for

• label_text_style(TextStyle | None) –

  Overrides the default value for

• mouse_cursor(ControlStateValue[MouseCursor | None] | None) –

  Overrides the default value for

• overlay_color(ControlStateValue[ColorValue] | None) –

  Overrides the default value for

• splash_border_radius(BorderRadiusValue | None) –

  Overrides the default value for

• tab_alignment(TabAlignment | None) –

  Overrides the default value for

• unselected_label_color(ColorValue | None) –

  Overrides the default value for

• unselected_label_text_style(TextStyle | None) –

  Overrides the default value for

Properties

divider_color class-attribute instance-attribute

divider_color: ColorValue | None = None

Overrides the default value for TabBar.divider_color.

divider_height class-attribute instance-attribute

divider_height: Number | None = None

Overrides the default value for TabBar.divider_height.

indicator class-attribute instance-attribute

indicator: UnderlineTabIndicator | None = None

Overrides the default value for TabBar.indicator.

indicator_animation class-attribute instance-attribute

indicator_animation: TabIndicatorAnimation | None = None

Overrides the default value for TabBar.indicator_animation.

indicator_color class-attribute instance-attribute

indicator_color: ColorValue | None = None

Overrides the default value for TabBar.indicator_color.

indicator_size class-attribute instance-attribute

indicator_size: TabBarIndicatorSize | None = None

Overrides the default value for TabBar.indicator_size.

label_color class-attribute instance-attribute

label_color: ColorValue | None = None

Overrides the default value for TabBar.label_color.

label_padding class-attribute instance-attribute

label_padding: PaddingValue | None = None

Overrides the default value for TabBar.label_padding.

label_text_style class-attribute instance-attribute

label_text_style: TextStyle | None = None

Overrides the default value for TabBar.label_text_style.

mouse_cursor class-attribute instance-attribute

mouse_cursor: (
    ControlStateValue[MouseCursor | None] | None
) = None

Overrides the default value for TabBar.mouse_cursor.

overlay_color class-attribute instance-attribute

overlay_color: ControlStateValue[ColorValue] | None = None

Overrides the default value for TabBar.overlay_color.

splash_border_radius class-attribute instance-attribute

splash_border_radius: BorderRadiusValue | None = None

Overrides the default value for TabBar.splash_border_radius.

tab_alignment class-attribute instance-attribute

tab_alignment: TabAlignment | None = None

Overrides the default value for TabBar.tab_alignment.

unselected_label_color class-attribute instance-attribute

unselected_label_color: ColorValue | None = None

Overrides the default value for TabBar.unselected_label_color.

unselected_label_text_style class-attribute instance-attribute

unselected_label_text_style: TextStyle | None = None

Overrides the default value for TabBar.unselected_label_text_style.

Examples

Example 1

page.theme = ft.Theme(
    tabs_theme=ft.TabBarTheme(
        divider_color=ft.Colors.BLUE,
        indicator_color=ft.Colors.RED,
        indicator_tab_size=True,
        label_color=ft.Colors.GREEN,
        unselected_label_color=ft.Colors.AMBER,
        overlay_color={
            ft.MaterialState.FOCUSED: ft.Colors.with_opacity(0.2, ft.Colors.GREEN),
            ft.MaterialState.DEFAULT: ft.Colors.with_opacity(0.2, ft.Colors.PINK),
        },
    )
)