TabsTheme
Customizes the appearance of Tabs control across the app.
indicator_border_radius: BorderRadiusValue | None = None
The radius of the indicator's corners.
indicator_border_side: BorderSide | None = None
The color and weight of the horizontal line drawn below the selected tab.
indicator_color: ColorValue | None = None
The color of the line that appears below the selected tab.
indicator_padding: PaddingValue | None = None
Locates the selected tab's underline relative to the tab's boundary. The
indicator_tab_size property can be used to define the tab indicator's bounds in
terms of its (centered) tab widget with False, or the entire tab with True.
label_padding: PaddingValue | None = None
Overrides the default value for Tabs.label_padding.
If there are few tabs with both icon and text and few tabs with only icon or text, this padding is vertically adjusted to provide uniform padding to all tabs.
label_text_style: TextStyle | None = None
Overrides the default value for
Tabs.label_text_style.
mouse_cursor: (
ControlStateValue[MouseCursor | None] | None
) = None
The cursor for a mouse pointer when it enters or is hovering over the individual tabs.
overlay_color: ControlStateValue[ColorValue] | None = None
Defines the ink response focus, hover, and splash colors. If specified, it is
resolved against one of ControlState.FOCUSED, ControlState.HOVERED, and
ControlState.PRESSED.
unselected_label_color: ColorValue | None = None
The color of unselected tab labels.
unselected_label_text_style: TextStyle | None = None
Overrides the default value for
Tabs.unselected_label_text_style.
Examples#
Example 1#
page.theme = ft.Theme(
tabs_theme=ft.TabsTheme(
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),
},
)
)