1

I am using BottomNavigationBar for 3 (A, B, C) screens and Drawer for 6 (A, B, C, D, E, F) screens.

When I first log in, the BottomNavigationBar widget is called, so it displays the first screen (A) with BottomNavigationBar. I am able to navigate to screens B and C through it. But, when I select any screen from the side Drawer, the BottomNavigationBar disappears.

I want the BottomNavigationBar to be displayed on all the screens.

Following is my code for the BottomNavigationBar widget -

class NewBottomNav extends StatefulWidget {
  @override
  _NewBottomNavState createState() => _NewBottomNavState();
}

class _NewBottomNavState extends State<NewBottomNav> {
  int _selectedIndex = 0;

  static const List<Widget> _widgetOptions = <Widget>[
    ConveyorDashboard(),
    Notifications(),
    Profile(),
  ];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey.shade200,
      body: _widgetOptions.elementAt(_selectedIndex),
      bottomNavigationBar: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.stacked_line_chart),
            label: 'Conveyor',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.notifications),
            label: 'Notifications',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.supervised_user_circle_rounded),
            label: 'Profile',
          ),
        ],
        currentIndex: _selectedIndex,
        selectedItemColor: Color.fromRGBO(36, 78, 145, 1),
        onTap: _onItemTapped,
      ),
    );
  }
}

Thank you in advance for helping out.

Sneha Singh
  • 143
  • 1
  • 14

0 Answers0