tabController property

TabController to customize Tabs.

There's a default tabController that works perfectly fine in the absence of the explicitly provided (this) tabController

Coordinates tab selection between a TabBar and a TabBarView.

The index property is the index of the selected tab and the animation represents the current scroll positions of the tab bar and the tab bar view. The selected tab's index can be changed with animateTo.

A stateful widget that builds a TabBar or a TabBarView can create a TabController and share it directly.

When the TabBar and TabBarView don't have a convenient stateful ancestor, a TabController can be shared by providing a DefaultTabController inherited widget.

{@tool snippet}

This widget introduces a Scaffold with an AppBar and a TabBar.

class MyTabbedPage extends StatefulWidget {
  const MyTabbedPage({ super.key });
  @override
  State<MyTabbedPage> createState() => _MyTabbedPageState();
}

class _MyTabbedPageState extends State<MyTabbedPage> with SingleTickerProviderStateMixin {
  static const List<Tab> myTabs = <Tab>[
    Tab(text: 'LEFT'),
    Tab(text: 'RIGHT'),
  ];

  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: myTabs.length);
  }

 @override
 void dispose() {
   _tabController.dispose();
   super.dispose();
 }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        bottom: TabBar(
          controller: _tabController,
          tabs: myTabs,
        ),
      ),
      body: TabBarView(
        controller: _tabController,
        children: myTabs.map((Tab tab) {
          final String label = tab.text!.toLowerCase();
          return Center(
            child: Text(
              'This is the $label tab',
              style: const TextStyle(fontSize: 36),
            ),
          );
        }).toList(),
      ),
    );
  }
}

{@end-tool}

{@tool dartpad} This example shows how to listen to page updates in TabBar and TabBarView when using DefaultTabController.

** See code in examples/api/lib/material/tab_controller/tab_controller.1.dart ** {@end-tool}

Implementation

TopTabBar class