Flutter how can i hide bottomnavbar in specific screens?

April 22, 2022

I have a bottom navbar but in some pages i want to hide it. How can i make it ? For example i want to see appbar in HomeScreen but i dont want see it on search screen. My code is like :

Scaffold(
      backgroundColor: _selectedIndex == 0 ? Colors.transparent : Colors.white,
      extendBodyBehindAppBar: _selectedIndex == 0 ? true : false,
      bottomNavigationBar: _navBarItems,
      body: Navigator(
        onGenerateRoute: (settings) {
          Widget page = const HomeScreen();
          if (settings.name == '/help_center') {
            page = const HelpCenterScreen();
          } else if (settings.name == '/search') {
            page = const SearchScreen();
          }
          return MaterialPageRoute(builder: (_) => page);
        },
      ),
    );

>Solution :

Simple wrap _navBarItems with Visibility widget:

//class variable
bool _isVisible = true;//default true

Scaffold(
  backgroundColor: _selectedIndex == 0 ? Colors.transparent : Colors.white,
  extendBodyBehindAppBar: _selectedIndex == 0 ? true : false,
  bottomNavigationBar: Visibility(
       visible: _isVisible,
       child: _navBarItems,
  ),
  body: Navigator(
    onGenerateRoute: (settings) {
      Widget page = const HomeScreen();
      if (settings.name == '/help_center') {
        page = const HelpCenterScreen();
        setState(() {
           _isVisible = true;
        });
      } else if (settings.name == '/search') {
        setState(() {
           _isVisible = false;
        });
        page = const SearchScreen();
      }
      return MaterialPageRoute(builder: (_) => page);
    },
  ),
);

And change visibility in if else structure with setState method.