flutter - 如何在 Flutter 的导航器中使用 WillPopScope？

Question

WillPopScope的回调没有在我预期的时候被触发。我如何使用 WillPopScope里面Navigator所以一条路线可以处理它自己的背压行为。

我正在学习使用 flutter ，我遇到了 Navigator用于创建多个页面(我知道还有其他导航小部件，但我正在寻找仅支持程序导航的东西，因此我可以处理所有用户界面)。

接下来我想看 Navigator正要回去，发现WillPopScope它包装了一个组件并有一个回调，当按下后退按钮时(如果组件被渲染)被调用。这对我来说似乎很理想，因为我只希望在呈现 Widget 时调用回调。

我尝试使用 WillPopScope内Navigator目的是让渲染的路由在按下后退按钮时调用它的回调( onWillPop )，但放置 WillPopScope内Navigator什么都不做(不调用回调)。

目的是有一个 Navigator导航到顶级路线，而这些路线本身可能具有 Navigator s，所以放 WillPopScope inside 意味着每条路线(或子路线)负责它自己的后退导航。

我查了很多问题似乎都集中在MaterialApp , Scaffold ，或其他处理导航的方式；我正在寻找如何在没有这些东西带来的 UI 的情况下处理这个问题(用例可能是一个测验应用程序，你需要点击下一步按钮继续前进，或类似的东西)。

这是最小的 main.dart我希望路由 2 处理它自己的后退导航(为了简单起见，我没有在这个例子中放置嵌套路由)。

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Navigation',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext parentContext) {
    return Container(
        color: Theme.of(context).colorScheme.primary,
        child: Navigator(
            initialRoute: "1",
            onGenerateRoute: (settings) {
              return PageRouteBuilder(pageBuilder: (BuildContext context,
                  Animation animation, Animation secondaryAnimation) {
                switch (settings.name) {
                  case "1":
                    return Container(
                        color: Colors.red,
                        child: GestureDetector(onTap: () {
                          debugPrint("going from 1 to 2");
                          Navigator.of(context).pushNamed("2");
                        }));
                  case "2":
                    return WillPopScope(
                      child: Container(color: Colors.green),
                      onWillPop: ()async {
                        debugPrint("popping from route 2 disabled");
                        return false;
                      },
                    );
                  default:
                    throw Exception("unrecognised route \"${settings.name}\"");
                }
              });
            })
    );
  }
}

在路线 1 或路线 2 中按下后退按钮时，应用程序将退出。我希望这只会出现在路线 1 中，而路线 2 应该只记录 popping from route 2 disabled (没有离开页面或离开应用程序的导航)。

据我了解， Navigator和 WillPopScope是用于此类事情的小部件，但如果不是，那么我将如何实现自包含(可能嵌套)路由。

Answer 1

您可以使用以下代码将 onWillPop 转发到另一个导航器:

onWillPop: () async {
    return !await otherNavigatorKey.currentState.maybePop();
}