Flutter dynamic bottom navigation bar

byMR

April 20, 2022

In my Project i have 4 screens.

Home – Help Center – Search – Profile.

In Home page: My AppBar has leading and action buttons without title and transparent.

In Help Center My AppBar has leading doesnt have action buttons has a title and its a custom appbar.

In Search Screen : Using same appbar as help center screen but has action buttons and leading.

My Question is: As you can understand in my app i using few diffrent appbars. So how can i connect that bottomNavigationBar dynamicly ? Appbars isn’t same thats why i cant use bottomNavigationBar for now.
So what can i do about it ? How can i make it dynamic ? Thanks for all responses!

>Solution :

What do you mean by connecting bottomNavigationBar?
I did not understand what your problem is completely, but if you want that bottom nav bar is common for your all pages you can use this approach:

//class variable
final _screens = [
  const Page1(),
  const Page2(),
  const Page3(),
];

//your start page
return Scaffold(
  resizeToAvoidBottomInset: false,
  body: Stack(
    children: [
      _screens[_currentIndex],
      //some code
    ],
  ),
);

And you can change _currentIndex by tapping your nav bar items. For more help you can share some code parts of your app and explanation.