TabController class Null safety
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.
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(),
),
);
}
}
This example shows how to listen to page updates in TabBar and TabBarView
when using DefaultTabController.
To create a local project with this code sample, run:
flutter create --sample=material.TabController.2 mysample
flutter create --sample=material.TabController.2 mysample
- Inheritance
-
- Object
- ChangeNotifier
- TabController
Constructors
- TabController({int initialIndex = 0, Duration? animationDuration, required int length, required TickerProvider vsync})
- Creates an object that manages the state required by TabBar and a TabBarView.
Properties
-
animation
→ Animation<
double> ? -
An animation whose value represents the current position of the TabBar's
selected tab indicator as well as the scrollOffsets of the TabBar
and TabBarView.
read-only
- animationDuration → Duration
-
Controls the duration of TabController and TabBarView animations.
read-only
- hashCode → int
-
The hash code for this object.
read-onlyinherited
- hasListeners → bool
- Whether any listeners are currently registered.
- index ↔ int
-
The index of the currently selected tab.
read / write
- indexIsChanging → bool
-
True while we're animating from previousIndex to index as a
consequence of calling animateTo.
read-only
- length → int
-
The total number of tabs.
final
- offset ↔ double
-
The difference between the animation's value and index.
read / write
- previousIndex → int
-
The index of the previously selected tab.
read-only
- runtimeType → Type
-
A representation of the runtime type of the object.
read-onlyinherited
Methods
-
addListener(
VoidCallback listener) → void -
Register a closure to be called when the object changes.
inherited
-
animateTo(
int value, {Duration? duration, Curve curve = Curves.ease}) → void - Immediately sets index and previousIndex and then plays the animation from its current value to index.
-
dispose(
) → void -
Discards any resources used by the object. After this is called, the
object is not in a usable state and should be discarded (calls to
addListener will throw after the object is disposed).
override
-
noSuchMethod(
Invocation invocation) → dynamic -
Invoked when a non-existent method or property is accessed.
inherited
-
notifyListeners(
) → void - Call all the registered listeners.
-
removeListener(
VoidCallback listener) → void -
Remove a previously registered closure from the list of closures that are
notified when the object changes.
inherited
-
toString(
) → String -
A string representation of this object.
inherited
Operators
-
operator ==(
Object other) → bool -
The equality operator.
inherited