如需转载,请注明出处:Flutter学习笔记(26)--返回拦截WillPopScope,实现1秒内点击两次返回按钮退出程序

在实际开发中,为了防止用户误触返回按钮导致程序退出,通常会设置为在1秒内连续点击两次才会退出应用程序。Android中一般的处理方式是在onKeyDown方法内做计时处理,当keyCode == KeyEvent.KEYCODE_BACK 且 两次点击返回按钮间隔时间小于1秒则退出应用程序,在Flutter中可以通过WillPopScope来实现拦截返回按钮,并且在其内部做计时处理。

WillPopScope构造函数:

const WillPopScope({
Key key,
@required this.child,
@required this.onWillPop,//回调函数,当用户点击返回按钮时调用
})

onWillPop是一个回调函数,当用户点击返回按钮时被调用,这里的返回按钮包括导航返回按钮及物理返回按钮,该回调需要返回一个Future对象,如果返回的Future最终值为false时,当前路由不出栈(不返回),如果返回为true时,则当前路由出栈退出。

下面的Demo是实现了在1秒内连续点击两次退出应用程序的功能。想要做到计时处理,就需要获取到当前时间,计算两次点击之间的时间差

获取当前时间:

DateTime.now()

计算当前时间和上次点击的时间差:

DateTime.now().difference(_lastPressedAt)

时间差判断(是否大于1秒):

DateTime.now().difference(_lastPressedAt) > Duration(seconds: )

完整Demo示例:

import 'package:flutter/material.dart';

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

class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return new DemoAppState();
}
} class DemoAppState extends State<DemoApp> {
DateTime _lastPressedAt;//上次点击的时间
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'WillPopScope Demo',
home: new Scaffold(
appBar: new AppBar(
title: new Text('WillPopScope Demo'),
),
body: new WillPopScope(
child: new Center(
child: new Text('WillPopScope'),
),
onWillPop: () async{
if(_lastPressedAt == null || (DateTime.now().difference(_lastPressedAt) > Duration(seconds: ))){
//两次点击间隔超过1秒,重新计时
_lastPressedAt = DateTime.now();
print(_lastPressedAt);
return false;
}
return true;
}
),
),
);
}
}

Flutter学习笔记(26)--返回拦截WillPopScope,实现1秒内点击两次返回按钮退出程序的更多相关文章

  1. Cocos2D-X2.2.3学习笔记9(处理重力感应事件,移植到Android加入两次返回退出游戏效果)

    这节我们来学习Cocos2d-x的最后一节.怎样处理重力感应事件.移植到Android后加入再按一次返回键退出游戏等.我这里用的Android.IOS不会也没设备呃 效果图不好弄,由于是要移植到真机上 ...

  2. Flutter学习笔记(41)--自定义Dialog实现版本更新弹窗

    如需转载,请注明出处:Flutter学习笔记(41)--自定义Dialog实现版本更新弹窗 功能点: 1.更新弹窗UI 2.强更与非强更且别控制 3.屏蔽物理返回键(因为强更的时候点击返回键,弹窗会消 ...

  3. Flutter学习笔记(4)--Dart函数

    如需转载,请注明出处:Flutter学习笔记(4)--Dart函数 Dart是一个面向对象的语言,所以函数也是对象,函数属于Function对象,函数可以像参数一样传递给其他函数,这样便于做回调处理: ...

  4. Flutter学习笔记(5)--Dart运算符

    如需转载,请注明出处:Flutter学习笔记(5)--Dart运算符 先给出一个Dart运算符表,接下来在逐个解释和使用.如下:                            描述       ...

  5. Flutter学习笔记(8)--Dart面向对象

    如需转载,请注明出处:Flutter学习笔记(7)--Dart异常处理 Dart作为高级语言,支持面向对象的很多特性,并且支持基于mixin的继承方式,基于mixin的继承方式是指:一个类可以继承自多 ...

  6. Flutter学习笔记(9)--组件Widget

    如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调 ...

  7. Flutter学习笔记(13)--表单组件

    如需转载,请注明出处:Flutter学习笔记(13)--表单组件 表单组件是个包含表单元素的区域,表单元素允许用户输入内容,比如:文本区域,下拉表单,单选框.复选框等,常见的应用场景有:登陆.注册.输 ...

  8. Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解

    如需转载,请注明出处:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解 最近一段时间生病了,整天往医院跑,也没状态学东西了,现在是好了不少了,也该继续学习啦!!! ...

  9. Flutter学习笔记(16)--Scaffold脚手架、AppBar组件、BottomNavigationBar组件

    如需转载,请注明出处:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解 今天的内容是Scaffold脚手架.AppBar组件.BottomNavigationBa ...

随机推荐

  1. 整合多个maven工程时Spring配置加载JDBC问题

    问题叙述: 两个工程都通过JDBC访问mysql数据库,各自运行OK, 但合并成一个maven工程后,发现前一个工程访问数据库异常,貌似拿不到自己的DAO. 解决办法: 发现这两个工程的xml配置中, ...

  2. luogu P1768 天路 |01分数规划+负环

    题目描述 言归正传,小X的梦中,他在西藏开了一家大型旅游公司,现在,他要为西藏的各个景点设计一组铁路线.但是,小X发现,来旅游的游客都很挑剔,他们乘火车在各个景点间游览,景点的趣味当然是不用说啦,关键 ...

  3. CSS3(1)---圆角边框、边框阴影

    CSS3(1)---圆角边框.边框阴影 CSS3可以简单理解成是CSS的增强版,它的优点在于不仅有利于开发与维护,还能提高网站的性能. 一.圆角边框 圆角在实际开放过程中,还是蛮常见的.以前基本是通过 ...

  4. Spring源码学习笔记之基于ClassPathXmlApplicationContext进行bean标签解析

    bean 标签在spring的配置文件中, 是非常重要的一个标签, 即便现在boot项目比较流行, 但是还是有必要理解bean标签的解析流程,有助于我们进行 基于注解配置, 也知道各个标签的作用,以及 ...

  5. windows下tomcat闪退问题(启动失败)

    1. 第一种情况:Java jdk环境变量没配置或配置有问题 java jdk详细的配置过程这里贴一下:https://jingyan.baidu.com/article/6dad5075d1dc40 ...

  6. 【JS】297-[译]正确使用 sort() 方法

    点击上方"前端自习课"关注,学习起来~ 英文原文:[<Usar correctamente el método sort()>]文章地址:查看阅读原文.注意:内容有做精 ...

  7. servlet读取请求参数后流失效的问题

    在用reset接口的时候,常常会使用request.getInputStream()方法,但是流只能读取一次,一旦想要加上一个过滤器用来检测用户请求的数据时就会出现异常. 在过滤器中通过流读取出用户p ...

  8. 【Eureka】服务发现调用

    [Eureka]服务发现调用 转载:https://www.cnblogs.com/yangchongxing/p/10779832.html 1.使用 Netfix Feign 客户端调用服务 首先 ...

  9. mysql数据库密码的修改与恢复

    一.mysql密码的修改与恢复 1.修改密码 mysqladmin -u root -p123 password 456 数据库内修改 method.first: update mysql.user ...

  10. Node6-2单元测试 覆盖率Istanbul

    Step1:安装Istanbul npm install -g istanbul Step2:在package.json里面添加,具体参考Istanbul的API写法 "scripts&qu ...