Невозможно заставить нижнюю панель навигации и маршрутизацию работать вместе во флаттере

Question

Я новичок в флаттере и не могу перейти на новую страницу из нижней панели навигации

У меня есть основное приложение

    class MyApp extends StatelessWidget {
          @override
           Widget build(BuildContext context) {
            SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
              statusBarColor: Colors.transparent,
            ));
            return MaterialApp(
              title: 'Flutter Demo',
              theme: ThemeData(primarySwatch: Colors.blue),
              builder: (BuildContext buildContext, Widget widtget) => Scaffold(
                body: RootNavigator(),
                bottomNavigationBar: BottomNavigation(),
              ),
            );
          }
        }

и Rootnavigator

    class RootNavigator extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return Navigator(
          initialRoute: '/',
          onGenerateRoute: (RouteSettings settings) {
            // final args = settings.arguments;

            return MaterialPageRoute(
                settings: settings,
                builder: (BuildContext context) {
                  switch (settings.name) {
                    case '/':
                      return Page1();
                    case '/page2':
                      return Page2();
                    case '/page3':
                      return Page3();
                    default:
                      return RouteErrorPage();
                  }
                });
              },
            );
          }
    }

И нижний навигатор

class BottomNavigation extends StatefulWidget {
  @override
  BottomNavigationState createState() {
    return new BottomNavigationState();
  }
}

class BottomNavigationState extends State<BottomNavigation> {
  int currIndex = 0;

  onTap(int index) {
    setState(() => currIndex = index);
    switch (index) {
      case 0:
        Navigator.pushNamed(context, '/');
        break;
      case 1:
        Navigator.pushNamed(context, '/page2');
        break;
      case 2:
        Navigator.pushNamed(context, 'page3');
        break;
      default:
        Navigator.push(
            context, MaterialPageRoute(builder: (_) => RouteErrorPage()));
    }
  }
   ....
  // added app bar items
}

Вкладки переключаются, а маршруты - нет. Он остается на главной странице. Я чувствую, что что-то связано с контекстом, но не знаю, как это решить. Кто-нибудь может помочь? Спасибо

ps, если я перемещаю нижнюю панель навигации на каждую страницу отдельно, все работает, кроме выбранной вкладки (из-за состояния), а также я хочу сохранить одну общую панель приложений

Answer 1

Ответ - комментарий @LoVe правильный. Вот как работает флаттер. если у вас есть нижняя навигация, вам нужно пролистывать страницы. Перенаправление означает переход на совершенно новую страницу, где вы должны определить Scaffold из sratch. Если вы хотите иметь общий AppBar - сделайте его многоразовым виджетом