Navigator.popUntil flutter 显示黑屏答案

【问题标题】：Navigator.popUntil flutter show black screenNavigator.popUntil flutter 显示黑屏
【发布时间】：2021-04-09 16:03:33
【问题描述】：

我的项目中有两个不同的流程。

主页 -> 页面A -> 页面B -> 页面C -> 页面A

从C页到A页，我用这段代码，效果很好。

   Navigator.popUntil(context, ModalRoute.withName(AssetMenu.ROUTE));

当收到推送通知时，用户点击推送通知，我希望它立即像这样导航

主页 -> 页面 B -> 页面 C -> 当点击页面 C 中的按钮时返回页面 A。

但是当点击页面C中的按钮时，它显示黑屏。

我应该如何处理？

【问题讨论】：

也许阅读这篇 Medium 文章可以更好地了解导航器：medium.com/flutter-community/flutter-push-pop-push-1bb718b13c31，然后这篇文章：ptyagicodecamp.github.io/… 都很好。

标签： flutter dart navigator

【解决方案1】：

在您的第二个用例中，Page A 缺失。当您调用Navigator.popUntil() 时，导航器会向上爬起路线堆栈并弹出它们，直到找到指定的路线。如果指定的路由不在堆栈上，它将删除路由，直到堆栈为空。这就是你得到黑屏的原因。

如果要将Main Page -> Page B -> Page C 转换为Main Page -> Page A，则必须调用Navigator.pushAndRemoveUntil()，其中新路由为Page A，并且谓词与Main Page 匹配。或者使用Navigator.pushNamedAndRemoveUntil()。

【讨论】：

如果我使用Navigator.pushNamedAndRemoveUntil()，当我在页面A中按下返回按钮时，它会返回主页吗？
什么条件下检查是否点击了通知？
您可以在这两个用例中使用该方法。首先，导航器推送Page A。然后，它会删除Page A 之前的所有路由。首先删除Page C，然后删除Page B。如果Page A 是初始路由堆栈的一部分，它将在第三次删除。然后导航器来到Main Page。它认为这是应该停止删除路由的路由。导航器现在有一个路由堆栈Main Page -> Page A。
所以，是的，如果您调用 Navigator.pop()，它将删除 Page A 并导航到 Main Page。
对不起，我真的不明白你。为什么页面 c 会先被移除？

【解决方案2】：

也许你可以试试这个

Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (context) => AssetMenu(),), (route) => route.isFirst);

【讨论】：

如果我想使用路由器怎么办？
Router 是什么意思？ ModalRoute.withName(AssetMenu.ROUTE) ?
是的。我怎么知道用户是否点击了通知以执行不同的导航器方法？
你写了这个then back to Page A when button in Page C is clicked。导航是有意完成的。不是吗？

【解决方案3】：

我建议使用名称路由，即使您的应用程序变得更大，页面越多，它也会更容易。我更喜欢让 main.dart 外部和 dart 内部的小部件只使用逻辑和路由，然后在创建你需要 A、B、C 的 3 个页面并设置你是第一页的主要 dart 代码之后（主页) 必须是 A 页。

继续你的页面，在 Statefull{ 或 Stateless { 下输入路由名称：

static const routeName = '/pageA';
static const routeName = '/pageB';
static const routeName = '/pageC';

在你的 main.dart 中定义路线：

home: WidgetFromPageA(),
      routes: {
        WidgetFromPageB.routeName: (ctx) => WidgetFromPageB(),
        WidgetFromPageC.routeName: (ctx) => WidgetFromPageC(),
        },

您可以从任何页面调用此操作：

Navigator.of(context).pushNamed(WidgetFromPageA.routeName);
Navigator.of(context).pushNamed(WidgetFromPageB.routeName);
Navigator.of(context).pushNamed(WidgetFromPageC.routeName);

通过这种方式，您可以转到页面 B 并在应用栏中的新页面上获得返回按钮。例如，当你在第二页时，使用 pushReplacement() 方法并打开第三页，当你点击返回按钮时，你将转到第一页并跳过第二页。

为了更清楚，您可以像这样导航到第四页：

[ 1 --push()--> 2 --pushReplacement()--> 3 --pushReplacement()--> 4]，当您点击返回按钮时，您将进入第一页。

【讨论】：