以编程方式更改选项卡并监听flutter中的选项卡更改事件

Question

我正在尝试通过单击按钮以编程方式更改选项卡 因此，当我运行代码时，一切正常，我单击 fab 按钮，选项卡会正确更改，您也可以在调试控制台中看到索引号...直到所选选项卡是最后一个选项卡的那一刻，并且在那一刻，我单击按钮我收到错误消息。我真的不明白。我真的不知道该怎么办。

这是我的代码：

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

  @override
  State<MyHome> createState() => _MyHomeState();
}

class _MyHomeState extends State<MyHome> with SingleTickerProviderStateMixin {
  late TabController _controller;
  int _selectedIndex = 0;

  @override
  void initState() {
    super.initState();
    _controller = TabController(length: 5, vsync: this);

    //listener adding...
    _controller.addListener(() {
      setState(() {
        _selectedIndex = _controller.index;

      });
      print("Selected Index: " + _controller.index.toString());
    });
  }

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

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 5,
      child: Scaffold(
        floatingActionButton: FloatingActionButton(onPressed: () {
          _controller.animateTo(_selectedIndex += 1);
        }),
        body: NestedScrollView(
            headerSliverBuilder: (context, innerBoxIsScrolled) {
              return [
                SliverAppBar(
                  title: const Text('WELCOME'),
                  floating: true,
                  pinned: true,
                  bottom: TabBar(controller: _controller, tabs: const [
                    Tab(child: Text('Flight')),
                    Tab(child: Text('Train')),
                    Tab(child: Text('Car')),
                    Tab(child: Text('Cycle')),
                    Tab(child: Text('Boat')),
                  ]),
                )
              ];
            },
            body: TabBarView(controller: _controller, children: const [
              Icon(Icons.flight, size: 350),
              Icon(Icons.directions_transit, size: 350),
              Icon(Icons.directions_car, size: 350),
              Icon(Icons.directions_bike, size: 350),
              Icon(Icons.directions_boat, size: 350),
            ])),
      ),
    );
  }
}

Answer 1

您应该区分

_selectedIndex

何时等于最后一个索引。

floatingActionButton: FloatingActionButton(onPressed: () {
  if (_selectedIndex == 4) {
    _controller.animateTo(_selectedIndex = 0);
  } else {
    _controller.animateTo(_selectedIndex += 1);
  }
}),