Flutter: Keep BottomNavigationBar When Push to New Screen with Navigator
In iOS, we have a UITabBarController which stays permanently at the bottom of the screen when we push to a new ViewController.
In Flutter, we have a bottomNavigationBar of a Scaffold. However, unlike iOS, when we Navigator.push to a new screen, this bottomNavigationBar disappears.
In my app, I want to fulfil this requirement: Home screen has a bottomNavigationBar with 2 items (a & b) presenting screen A & B. By default, screen A is displayed. Inside screen A, there is a button. Tap that button, Navigator.push to screen C. Now in screen C, we can still see the bottomNavigationBar. Tap item b, I go to screen B. Now in screen B, tap item a in the bottomNavigationBar, I go back to screen C (not A, A is currently below C in the navigation hierarchy).
How can I do this? Thanks, guys.
Edit: I'm including some pictures for demonstration:
Screen A Screen A
Tap Go to C button, push to screen C Screen C
Tap Right item inside bottom navigation bar, go to screen B Screen B
Answer
tl;dr: Use CupertinoTabBar with CupertinoTabScaffold
The problem is not in Flutter but in UX just like Rémi Rousselet has mentioned.
It turned out Material Design doesn't recommend sub-pages in the hierarchy to access the Bottom navigation bar.
However, iOS Human Interface Guide recommend this. So, to use this feature, I had to adapt Cupertino widgets instead of Material ones. Specifically, in main, return a WidgetsApp/MaterialApp which contains a CupertinoTabScaffold. Implement the tab bar with a CupertinoTabBar and each screen is a CupertinoTabView.