码迷,mamicode.com
首页 > 其他好文 > 详细

Flutter 功能型组件:WillPopScope

时间:2020-01-15 15:29:34      阅读:73      评论:0      收藏:0      [点我收藏+]

标签:create   物理   路由   stp   time   点击   scope   总结   return   

前言

为了避免用户误触返回按钮而导致APP退出,在很多APP中都拦截了用户点击返回键的按钮,然后进行一些防误触判断,比如当用户在某一个时间段内点击两次时,才会认为用户是要退出(而非误触)。Flutter中可以通过WillPopScope来实现返回按钮拦截。

接口描述

const WillPopScope({
    Key key,
    @required this.child,
    // onWillPop是一个回调函数,当用户点击返回按钮时被调用(包括导航返回按钮及Android物理返回按钮)。
    // 该回调需要返回一个Future对象,如果返回的Future最终值为false时,则当前路由不出栈(不会返回);最终值为true时,当前路由出栈退出。我们需要提供这个回调来决定是否退出。
    @required this.onWillPop,
  })

代码示例

// 导航返回拦截(WillPopScope)

// 为了避免用户误触返回按钮而导致APP退出,在很多APP中都拦截了用户点击返回键的按钮,然后进行一些防误触判断,比如当用户在某一个时间段内点击两次时,才会认为用户是要退出(而非误触)。

// 例子:为了防止用户误触返回键退出,我们拦截返回事件。当用户在1秒内点击两次返回按钮时,则退出;如果间隔超过1秒则不退出,并重新记时。
import 'package:flutter/material.dart';

class WillPopScopeTest extends StatefulWidget{
  WillPopScopeTestState createState() => WillPopScopeTestState();
}

class WillPopScopeTestState extends State<WillPopScopeTest>{
  // 上次点击时间
  DateTime _lastPressedAt;

  Widget build(BuildContext context){
    return WillPopScope(
      onWillPop: () async{
        if(_lastPressedAt == null || DateTime.now().difference(_lastPressedAt) > Duration(seconds: 1)){
          // 两次点击间隔超过1秒则重新计时
          _lastPressedAt = DateTime.now();
          return false;
        }
        return true;
      },
      child: Container(
        alignment: Alignment.center,
        child: Text('1秒内连续按两次返回键退出'),
      ),
    );
  }
}

总结

无。

Flutter 功能型组件:WillPopScope

标签:create   物理   路由   stp   time   点击   scope   总结   return   

原文地址:https://www.cnblogs.com/parzulpan/p/12196900.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!