Pop all screen when click at PersistentBottomNavBarItem

Viewed 99

I used persistent_bottom_nav_bar to keep BottomNavigationBar in app.

In BottomTab A, appear screen A1, I click button in screen A1 to navigate to screen A2 and keep BottomNavBar. After I select BottomTab B => appear screen B. But when I select BottomTab A => appear screen A2 (I want to appear screen A1 when clicking at BottomTab A again).

Help me!!!!!

1 Answers

Use this code to achieve bottom navigation bar, And customize it as per your requirements...

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: ""),
            ]));
  }
}
Related