TTabs<T> class

A tab navigation component with indicator.

TTabs provides tab navigation with:

• Icon and/or text tabs
• Active indicator line
• Disabled state support
• Inline or full-width layout
• Horizontal or vertical orientation
• Scrollable mode with navigation controls
• Wrap mode for multi-line layout
• Custom tab builder support
• Custom colors

Basic Usage

TTabs<int>(
  tabs: [
    TTab(value: 0, text: 'Home', icon: Icons.home),
    TTab(value: 1, text: 'Profile', icon: Icons.person),
    TTab(value: 2, text: 'Settings', icon: Icons.settings),
  ],
  selectedValue: currentTab,
  onTabChanged: (value) => setState(() => currentTab = value),
)

Scrollable Tabs with Navigation

TTabs<int>(
  tabs: manyTabs,
  selectedValue: currentTab,
  onTabChanged: (value) => setState(() => currentTab = value),
  scrollable: true,
  showNavigationButtons: true,
)

Vertical Tabs

TTabs<String>(
  tabs: tabs,
  selectedValue: selectedTab,
  onTabChanged: (value) => loadData(value),
  axis: Axis.vertical,
)

Wrap Mode

TTabs<String>(
  tabs: tabs,
  selectedValue: selectedTab,
  onTabChanged: (value) => loadData(value),
  inline: true,
  wrap: true,
)

Custom Tab Builder

TTabs<String>(
  tabs: tabs,
  selectedValue: selectedTab,
  onTabChanged: (value) => loadData(value),
  tabBuilder: (context, tab, isSelected) {
    return CustomTabWidget(tab: tab, isSelected: isSelected);
  },
)

Type parameter:

• T: The type of tab values

See also:

• TTab for tab configuration

Inheritance

• Object
• DiagnosticableTree
• Widget
• StatefulWidget
• TTabs

Constructors

TTabs({Key? key, required List<TTab<T>> tabs, TTabController<T>? controller, T? selectedValue, ValueChanged<T>? onTabChanged, Color? borderColor, Color? selectedColor, Color? unselectedColor, Color? disabledColor, Color? indicatorColor, EdgeInsets? tabPadding, double tabSpacing = 2, double tabRunSpacing = 2, double? indicatorWidth = 1, bool inline = false, Axis axis = Axis.horizontal, bool scrollable = false, bool showNavigationButtons = true, bool wrap = false, Widget tabBuilder(BuildContext context, TTab<T> tab, bool isSelected, VoidCallback? onTap)?, Color? navigationButtonColor, Color? navigationButtonBackgroundColor})

Creates a tabs component.

const

Properties

axis → Axis

The axis along which the tabs are laid out.

final

borderColor → Color?

Border color for the tab bar.

final

controller → TTabController<T>?

Optional controller for managing tab state.

final

disabledColor → Color?

Color for disabled tabs.

final

hashCode → int

The hash code for this object.

no setter, inherited

indicatorColor → Color?

Color for the selection indicator.

final

indicatorWidth → double?

Width of the selection indicator.

final

inline → bool

Whether to use inline layout instead of full-width.

final

key → Key?

Controls how one widget replaces another widget in the tree.

final, inherited

navigationButtonBackgroundColor → Color?

Background color for navigation buttons.

final

navigationButtonColor → Color?

Color for navigation buttons.

final

onTabChanged → ValueChanged<T>?

Callback fired when a tab is selected.

final

runtimeType → Type

A representation of the runtime type of the object.

no setter, inherited

scrollable → bool

Whether tabs should be scrollable. When true, tabs can be scrolled with swipe gestures and navigation buttons.

final

selectedColor → Color?

Color for the selected tab.

final

selectedValue → T?

The currently selected tab value.

final

showNavigationButtons → bool

Whether to show navigation buttons in scrollable mode. Only shown on desktop/web platforms.

final

tabBuilder → Widget Function(BuildContext context, TTab<T> tab, bool isSelected, VoidCallback? onTap)?

Custom builder for tab widgets. When provided, this builder is used instead of the default tab rendering. Receives the context, tab, whether it's selected, and the onTap callback. The builder should handle its own Material/InkWell for interaction.

final

tabPadding → EdgeInsets?

Padding for each tab.

final

tabRunSpacing → double

final

tabs → List<TTab<T>>

The list of tabs to display.

final

tabSpacing → double

Spacing for each tab

final

unselectedColor → Color?

Color for unselected tabs.

final

wrap → bool

Whether to wrap tabs into multiple lines when using inline mode. Mutually exclusive with scrollable mode.

final

Methods

createElement() → StatefulElement

Creates a StatefulElement to manage this widget's location in the tree.

inherited

createState() → State<TTabs<T>>

Creates the mutable state for this widget at a given location in the tree.

override

debugDescribeChildren() → List<DiagnosticsNode>

Returns a list of DiagnosticsNode objects describing this node's children.

inherited

debugFillProperties(DiagnosticPropertiesBuilder properties) → void

Add additional properties associated with the node.

inherited

noSuchMethod(Invocation invocation) → dynamic

Invoked when a nonexistent method or property is accessed.

inherited

toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode

Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.

inherited

toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String

A string representation of this object.

inherited

toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String

Returns a string representation of this node and its descendants.

inherited

toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String

Returns a one-line detailed description of the object.

inherited

toStringShort() → String

A short, textual description of this widget.

inherited

Operators

operator ==(Object other) → bool

The equality operator.

inherited