美文网首页
Flutter拦截返回事件

Flutter拦截返回事件

作者: itfitness | 来源:发表于2022-11-19 15:24 被阅读0次

目录

前言

一般应用都会在主页面拦截返回事件,以防止用户误点返回,所以会在一定的时间内需要用户返回两次才可以退出应用

效果实现

这里我们使用WillPopScope来进行拦截返回事件,具体如下:

class MainPage extends StatefulWidget {
  const MainPage({Key? key}) : super(key: key);

  @override
  State<MainPage> createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  DateTime? lastPressedAt; //上次点击时间
  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        if (lastPressedAt == null ||
            DateTime.now().difference(lastPressedAt!) > Duration(seconds: 3)) {
          //两次点击间隔超过1秒则重新计时
          lastPressedAt = DateTime.now();
          ToastUtil.showToast("再按一次退出应用");
          return false;
        }
        return true;
      },
      child:  Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
          elevation: 0.2,
          centerTitle: true,
          title: Text(titles[currentIndex],style: TextStyle(
              color: Colors.black
          ),),
        ),
        body: Text("测试"),
      ),
    );
  }
}

其中显示Toast的是使用的第三方的依赖fluttertoast,具体使用可以去pub.dev中查找,这里我把Toast封装了一下

import 'package:fluttertoast/fluttertoast.dart';
import 'package:flutter/material.dart';

class ToastUtil{
  static showToast(String msg){
    Fluttertoast.showToast(
        msg: msg,
        toastLength: Toast.LENGTH_SHORT,
        gravity: ToastGravity.CENTER,
        timeInSecForIosWeb: 1,
        backgroundColor: Colors.black87,
        textColor: Colors.white,
        fontSize: 16.0
    );
  }
}

以上代码运行后的效果如下:


相关文章

  • Flutter拦截返回事件

    目录 前言 一般应用都会在主页面拦截返回事件,以防止用户误点返回,所以会在一定的时间内需要用户返回两次才可以退出应...

  • webview

    如果想要拦截事件/离开当前webview 返回true ,否则返回false Android webView拦截u...

  • iOS 系统返回按钮事件拦截Swift版本

    iOS 系统返回按钮事件拦截OC版本系统返回按钮事件拦截 主要实现原理 如何使用 如何禁用系统?右滑返回手势 de...

  • Flutter Dio 拦截器退出登录

    [toc] Flutter Dio 拦截器退出登录 拦截器拦截登录失效事件 编写登录校验拦截器 编写对应的登录校验...

  • Flutter 拦截返回按钮

    WillPopScope组件 参考文章 主要作用 拦截某个页面的返回按钮 禁用ios的左滑返回 安卓连续两次点击物...

  • 监听UINavigationContorller返回按钮事件

    // 拦截返回按钮事件 if ([self.navigationController.viewController...

  • Flutter-常用组件(持续更新)

    题纲: WillPopScope GestureDetector 1.WillPopScope拦截、监听返回事件 ...

  • runtime 拦截系统导航栏返回事件

    1、既然要拦截按钮的事件,简单粗暴,先看下点击系统返回按钮后发生了什么: 第二部分是按钮事件,不考虑拦截,毕竟拦截...

  • MUI 拦截返回事件

    场景描述 在项目中有一个切换statusBar样式的需求A界面进去B界面后将statusBar设置为light样式...

  • Android触摸事件传递

    情况1:默认情况,全部返回super,默认情况下不拦截不消费事件。 全部默认返回super情况下,down事件后的...

网友评论

      本文标题:Flutter拦截返回事件

      本文链接:https://www.haomeiwen.com/subject/qosdxdtx.html