Multiple navigators in Flutter causes problem with pop

生来就可爱ヽ(ⅴ<●) 提交于 2021-02-20 04:12:27

问题


I'm struggling in a Flutter situation with multiple navigators. Concept here is a page which triggers a modal with his own flow of multiple pages. Inside the modal everything is going swiftly (navigation pushes/pops are working), but if the modal is dismissed it removes every page of the lowest navigator. I've looked at the example of https://stackoverflow.com/a/51589338, but I'm probably missing something here.

There's a wrapper Widget inside a page which is the root of the application.

class Wrapper extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Padding(
        padding: EdgeInsets.only(top: 10, bottom: 20),
        child: FlatButton(
          child: Padding(
            padding: EdgeInsets.symmetric(vertical: 5),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Text(
                  'Open modal',
                ),
              ],
            ),
          ),
          onPressed: () {
            Navigator.of(context).push(
              MaterialPageRoute(
                settings: RouteSettings(name: '/modal'),
                builder: (context) => Modal(),
              ),
            );
          },
        ),
      ),
    );
  }
}

The modal initiates a Scaffold with his own navigator to handle its own flow.

class Modal extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: new Navigator(
        initialRoute: FirstModalPage.route().toString(),
        onGenerateRoute: (routeSettings) {
          final path = routeSettings.name;
          if (path == '/secondmodalpage') {
            return MaterialPageRoute(
              settings: routeSettings,
              builder: (_) => SecondModalPage(),
            );
          }

          return new MaterialPageRoute(
            settings: routeSettings,
            builder: (_) => FirstModalPage(),
          );
        },
      ),
    );
  }
}

The pages inside the modal are below with a close button which should remove the modal from the root navigator. But for some reason if I call pop() it removes all pages from the widget tree. And popUntil((route) => route.isFirst) doesn't do anything at all. If I'm looking at the widget via the Widget Inspector it does say that the Wrapper and Modal are on the same level.

class FirstModalPage extends StatelessWidget {
  static Route route() {
    return MaterialPageRoute<void>(builder: (_) => FirstModalPage());
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        mainAxisSize: MainAxisSize.max,
        children: <Widget>[
          Padding(
            padding: EdgeInsets.only(
              top: 30,
              right: 20,
              bottom: 10,
              left: 20,
            ),
            child: Row(
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  behavior: HitTestBehavior.translucent,
                  onTap: () {
                    if (Navigator.of(context).canPop()) {
                      Navigator.of(context).pop();
                    }
                  },
                  child: Text('Back'),
                ),
                Text(
                  'First modal page title'
                ),
                GestureDetector(
                  behavior: HitTestBehavior.translucent,
                  onTap: () {
                    Navigator.of(context, rootNavigator: true).popUntil(
                      (route) => route.isFirst,
                    );
                  },
                  child: Text('Close'),
                ),
              ],
            ),
          ),
          FlatButton(
            onPressed: () {
              Navigator.of(context).push(
                MaterialPageRoute(builder: (context) => SecondModalPage()),
              );
            },
            child: Text(
              'Second modal page'
            ),
          ),
        ],
      ),
    );
  }
}

来源:https://stackoverflow.com/questions/64755190/multiple-navigators-in-flutter-causes-problem-with-pop

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!