Класс TabController

Класс TabController хранит индекс и анимацию вкладок. Длину задают в length при создании, передают в controller у TabBar и TabBarView. Переключение: animateTo. Проще обернуть экран в DefaultTabController.

Синтаксис

TabController(
	length: 2,
	vsync: tickerProvider,
)

Параметры

Параметр	Описание
`length`	Сколько вкладок у контроллера.
`vsync`	Источник тактов для анимации смены вкладки. Обычно это State с миксином `SingleTickerProviderStateMixin`.

Методы

Метод	Описание
`animateTo`	Плавно переключает вкладку по индексу.
`dispose`	Отпускает контроллер вкладок и его слушателей.

Пример

Давайте используем DefaultTabController без ручного TabController:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: DefaultTabController(
				length: 2,
				child: Scaffold(
					appBar: AppBar(
						bottom: TabBar(
							tabs: [Tab(text: 'abcde'), Tab(text: '12345')],
						),
					),
					body: TabBarView(
						children: [
							Center(child: Text('11111')),
							Center(child: Text('22222')),
						],
					),
				),
			),
		),
	);
}

TabController создаётся внутри DefaultTabController автоматически.

Пример

Давайте прочитаем index через DefaultTabController.of:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: DefaultTabController(
				length: 2,
				child: Scaffold(
					appBar: AppBar(
						bottom: TabBar(tabs: [Tab(text: 'abcde'), Tab(text: '12345')]),
					),
					body: Builder(
						builder: (context) {
							final c = DefaultTabController.of(context);
							return Center(child: Text('${c.index}'));
						},
					),
				),
			),
		),
	);
}

На экране число текущего индекса вкладки.

Смотрите также

виджет DefaultTabController,
который создаёт TabController
виджет TabBar,
который использует controller
виджет TabBarView,
страницы вкладок
виджет Tab,
подпись одной вкладки