Skip to content

alvisjerome/nested-navigation-demo-flutter

 
 

Repository files navigation

Flutter BottomNavigationBar with Multiple Navigators

This is the source code for my article:

Preview

In this example each tab has its own navigation stack. This is so that we don’t lose the navigation history when switching tabs.

This is a very common use case for a lot of apps.

How is it built?

  • Create an app with a Scaffold and a BottomNavigationBar.
  • In the Scaffold body, create a Stack with one child for each tab.
  • Each child is an Offstage widget with a child Navigator.
  • Don't forget to handle Android back navigation with WillPopScope.

Read the full story on my article:

Credits

  • Brian Egan: for suggesting to use Stack + Offstage & Navigator widgets.

About

Nested navigation with BottomNavigationBar

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Dart 62.5%
  • HTML 27.5%
  • Swift 8.5%
  • Kotlin 1.2%
  • Objective-C 0.3%