首页 > 解决方案 > 单击 PersistentBottomNavBarItem 时弹出所有屏幕

问题描述

我使用 persistent_bottom_nav_bar 将 BottomNavigationBar 保留在应用程序中。

在BottomTab A中,出现屏幕A1,我单击屏幕A1中的按钮导航到屏幕A2并保留BottomNavBar。在我选择 BottomTab B => 出现屏幕 B 之后。但是当我选择 BottomTab A => 出现屏幕 A2 时(我想在再次单击 BottomTab A 时出现屏幕 A1)。

帮我!!!!!

标签: flutterflutter-layout

解决方案


使用此代码实现底部导航栏,并根据您的要求对其进行自定义...

class BottomNavBar extends StatefulWidget {
  const BottomNavBar({Key? key}) : super(key: key);

  @override
  _BottomNavBarState createState() => _BottomNavBarState();
}

class _BottomNavBarState extends State<BottomNavBar> {
  int pageIndex = 0;
  List<Widget> pageList = <Widget>[Home(), Profile(), Setting()];//Here define your own screens

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: pageList[pageIndex],
        bottomNavigationBar: BottomNavigationBar(
            fixedColor: Colors.redAccent[400],
            currentIndex: pageIndex,
            onTap: (value) {
              setState(() {
                pageIndex = value;
              });
            },
            // type: BottomNavigationBarType.fixed,
            items: [
              BottomNavigationBarItem(
                  activeIcon: Icon(
                    Icons.home,
                    color: AppColors.black,
                  ),
                  icon: Icon(
                    Icons.home,
                    color: AppColors.grey,
                  ),
                  label: ""),
              BottomNavigationBarItem(
                  activeIcon: Icon(
                    Icons.person,
                    color: AppColors.black,
                  ),
                  icon: Icon(
                    Icons.person,
                    color: AppColors.grey,
                  ),
                  label: ""),
              BottomNavigationBarItem(
                  activeIcon: Icon(
                    Icons.settings,
                    color: AppColors.black,
                  ),
                  icon: Icon(
                    Icons.settings,
                    color: AppColors.grey,
                  ),
                  label: ""),
            ]));
  }
}

推荐阅读