如何在BottomAppBar flutter上以编程方式更改选项卡？

问题描述

我正在开发一个 Flutter 应用程序，我需要以编程方式更改我的选项卡，这里如果我来到堆栈的最后一个屏幕，那么我需要以编程方式重定向到第一个选项卡，而不是关闭应用程序。

请考虑以下代码片段：

final PageStorageBucket bucket = PageStorageBucket();

Widget currentScreen = HomeFragment();

Widget build(BuildContext context) {
return Scaffold(
  backgroundColor: Color(0xFFF3F5F9),body: PageStorage(
    child: currentScreen,bucket: bucket,),bottomNavigationBar: BottomAppBar(
    shape: CircularNotchedRectangle(),child: Container(
      width: double.infinity,height: 15.5,child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,children: <Widget>[
          GestureDetector(
            onTap: () {
              setState(() {
                currentScreen = HomeFragment();
                currentTab = 0;
              });
            },child: Expanded(
              child: Container(
                height: 15.5,color: Colors.white,child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
                    Image.asset(
                      'assets/home.png',color: currentTab == 0 ? Color(0xFF193F70) : Color(0xFFABAAAA),SizedBox(
                      height: 3.0,Text(
                      'Home',],GestureDetector(
            onTap: () {
              setState(() {
                redirectToLogin();
              });
            },children: <Widget>[
                    Image.asset(
                      'assets/login_icon.png',color: currentTab == 1 ? Color(0xFF193F70) : Color(0xFFABAAAA),Text(
                      'Login',GestureDetector(
            onTap: () {
              setState(() {
                redirectToSignUp();
              });
            },children: <Widget>[
                    Image.asset(
                      'assets/signup_icon.png',color: currentTab == 2 ? Color(0xFF193F70) : Color(0xFFABAAAA),Text(
                      'SignUp',GestureDetector(
            onTap: () {
              setState(() {
                currentScreen = ProfileFrag();
                currentTab = 3;
              });
            },children: <Widget>[
                    Image.asset(
                      'assets/menu_icon.png',color: currentTab == 3 ? Color(0xFF193F70) : Color(0xFFABAAAA),Text(
                      'Menu',);}

在这里，我正在寻找可以以编程方式重定向到不同选项卡的内容。如果我在这里做错了什么，也请告诉我。

解决方法

我相信使用真正的 Flutter TabBar 会更好。你考虑过这个解决方案吗？ 这个博客上有一个完整的教程：https://blog.logrocket.com/flutter-tabbar-a-complete-tutorial-with-examples/ 它包括一种以编程方式更改选项卡的方法。这实际上是我试图用我自己的应用程序做的事情。 如果这对您有用，请告诉我。