Flutter 监听物理返回键

在 Android 平台中,有个物理返回键,一般默认可以返回上一个页面。Android 中 Activity 会提供返回键的监听函数,但是在 Flutter 中一切皆是 Widget,它并没有像 Android 这样直接提供某个监听函数,而是通过 WillPopScope 组件来实现返回键的监听的。

1. WillPopScope

这是一个有状态组件,只需要将组件外包一层 WillPopScope 组件即可。

class WillPopScope extends StatefulWidget {
  const WillPopScope({
    super.key,
    required this.child,
    required this.onWillPop,
  }) : assert(child != null);
  
  final Widget child;
  final WillPopCallback? onWillPop;
}

onWillPop 是一个 Future<bool> 函数,可以监听物理返回键事件。如果返回 true,则会回退到上一个页面,如果返回 false,则直接拦截了物理返回键。

2. 在页面中使用

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    return Scaffold(
      body: WillPopScope(
          child: Container(),
          onWillPop: () async {
            //这里可以响应物理返回键
            return false;  
          }),
    );
  }

在页面中使用时,只需要在 Scaffold 的 body 属性里包上一层 WillPopScope 。

3. 弹窗中阻止物理返回键取消弹窗

  showDialog(
      context: context,
      barrierDismissible: false,
      builder: (context) {
        return WillPopScope(
            child: AlertDialog(
              title: ' ',
              content: ' ',
              actions: actions,
            ),
            onWillPop: () async {
              //弹窗弹出后,按物理返回键,就不会取消弹窗了
              return false;
            });
      });

可见,在 Flutter 中一切皆 Widget,连一个物理返回键的事件也是通过 Widget 来实现的。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容