Метод animateTo

Метод animateTo класса TabController меняет index у с анимацией. Первый аргумент - номер вкладки, опционально duration и curve. Синхронизирует TabBar и TabBarView.

Синтаксис

tabController.animateTo(
	1,
	duration: Duration(milliseconds: 300),
	curve: Curves.easeInOut,
)

Параметры

Параметр	Описание
`value`	Индекс вкладки от `0` до length - `1`.
`duration`	Длительность анимации переключения.
`curve`	Кривая скорости анимации.

Пример

Давайте переключим вкладку кнопкой через animateTo:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: TabAnimateDemo()));
}

class TabAnimateDemo extends StatefulWidget
{
	const TabAnimateDemo({super.key});

	@override
	State<TabAnimateDemo> createState() => _TabAnimateDemoState();
}

class _TabAnimateDemoState extends State<TabAnimateDemo>
	with SingleTickerProviderStateMixin
{
	late TabController tabController;

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

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

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			appBar: AppBar(
				title: Text('abcde'),
				bottom: TabBar(
					controller: tabController,
					tabs: [
						Tab(text: '12345'),
						Tab(text: 'abcde'),
					],
				),
			),
			body: TabBarView(
				controller: tabController,
				children: [
					Center(child: Text('12345')),
					Center(child: Text('abcde')),
				],
			),
			floatingActionButton: FloatingActionButton(
				onPressed: () {
					tabController.animateTo(1);
				},
				child: Icon(Icons.arrow_forward),
			),
		);
	}
}

FAB вызовет animateTo(1) и откроет вторую вкладку.

Пример

Давайте вернёмся на первую вкладку без длительной анимации:

import 'package:flutter/material.dart';

void main()
{
	runApp(const MaterialApp(home: TabJumpDemo()));
}

class TabJumpDemo extends StatefulWidget
{
	const TabJumpDemo({super.key});

	@override
	State<TabJumpDemo> createState() => _TabJumpDemoState();
}

class _TabJumpDemoState extends State<TabJumpDemo>
	with SingleTickerProviderStateMixin
{
	late TabController tabController;

	@override
	void initState()
	{
		super.initState();
		tabController = TabController(length: 2, vsync: this);
		tabController.index = 1;
	}

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

	@override
	Widget build(BuildContext context)
	{
		return Scaffold(
			body: Center(
				child: ElevatedButton(
					onPressed: () {
						tabController.animateTo(0);
					},
					child: Text('12345'),
				),
			),
		);
	}
}

animateTo(0) вернёт controller на первую вкладку.

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

класс TabController,
состояние вкладок
виджет TabBar,
полоска вкладок
виджет TabBarView,
содержимое вкладок
метод addListener,
слушать смену index