在 Flutter 中更改选项卡时禁用动画

Question

我在 flutter 中有一个带有 3 个选项卡的选项卡栏。当从第一个选项卡更改为第三个选项卡时，也会调用 tab2 的 initState 方法。我不想要这样。

import 'package:flutter/material.dart';

void main() {
  runApp(TabBarDemo());
}

class TabBarDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.directions_transit)),
                Tab(icon: Icon(Icons.directions_bike)),
              ],
            ),
            title: Text('Tabs Demo'),
          ),
          body: TabBarView(
            children: [
              Icon(Icons.directions_car),
              Icon(Icons.directions_transit),
              Icon(Icons.directions_bike),
            ],
          ),
        ),
      ),
    );
  }
}

当在 tab1 上并单击 tab3 时，我希望立即显示 tab3。没有动画。

Answer 1

通过将动画持续时间设置为零来禁用颤动选项卡之间的动画，如下所示

    tabController = TabController(
    animationDuration: Duration.zero); 

晚点再谢我！

Answer 2

我还没有对此进行测试，但您可以尝试TabController为TabBarand设置自定义TabBarView，它会覆盖该animateTo方法以跳过动画：

class CustomTabController extends TabController {
  @override
  void animateTo(int value, {Duration duration = kTabScrollDuration, Curve curve = Curves.ease}) {
    super.animateTo(value, duration: null, curve: null);
  }
}