如何在颤动中分离出后退按钮的一键和双击？

Question

[我正在尝试通过双击CupertinoTabbar中的后退按钮来使功能退出应用程序。

尽管我已经应用了DoubleBackToCloseApp插件或WillPopScope等各种功能，但是只要我轻按返回按钮，就会出现退出消息。

因此，我想构建如下代码工作：

• 只需单击一次后退按钮，然后返回上一页
• 几秒钟内轻按两次，退出应用程序。

我的标签栏如下：

class TabPage extends StatefulWidget {

  final FirebaseUser currentUser;

  TabPage(this.currentUser);

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

class _TabPageState extends State<TabPage> {
  int _selectedIndex = 0;

  static const snackBarDuration = Duration(seconds: 1);

  DateTime backbuttonpressedTime;


  final FirebaseMessaging _firebaseMessaging = FirebaseMessaging();

  final GlobalKey<NavigatorState> homeTabNavKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> groupTabNavKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> feedTabNavKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> userTabNavKey = GlobalKey<NavigatorState>();

  @override
  void initState() {
    _firebaseMessaging.onTokenRefresh.listen(sendTokenToServer);
    _firebaseMessaging.getToken();
  }

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () async {
        return !await currentNavigatorKey().currentState.maybePop();
      },
      child: Scaffold(
        body: WillPopScope(
          onWillPop: _onWillPop,
          child: CupertinoTabScaffold(
            tabBar: CupertinoTabBar(
              activeColor: Theme
                  .of(context)
                  .colorScheme
                  .mainColor,
              inactiveColor: Theme
                  .of(context)
                  .colorScheme
                  .greyColor,
              items: [
                BottomNavigationBarItem(
                    icon: Icon(Icons.home)),
                BottomNavigationBarItem(
                    icon: Icon(Icons.group)),
                BottomNavigationBarItem(
                    icon: Icon(Icons.favorite_border)),
                BottomNavigationBarItem(
                    icon: Icon(Icons.account_circle)),
              ],
              onTap: (index) {
                // back home only if not switching tab
                if (_selectedIndex == index) {
                  switch (index) {
                    case 0:
                      homeTabNavKey.currentState.popUntil((r) => r.isFirst);
                      break;
                    case 1:
                      groupTabNavKey.currentState.popUntil((r) => r.isFirst);
                      break;
                    case 2:
                      feedTabNavKey.currentState.popUntil((r) => r.isFirst);
                      break;
                    case 3:
                      userTabNavKey.currentState.popUntil((r) => r.isFirst);
                      break;
                  }
                }
                _selectedIndex = index;
              },
            ),
            tabBuilder: (BuildContext context, int index) {
              switch (index) {
                case 0:
                  return CupertinoTabView(
                    navigatorKey: homeTabNavKey,
                    builder: (BuildContext context) => HomePage(),
                  );
                  break;
                case 1:
                  return CupertinoTabView(
                    navigatorKey: groupTabNavKey,
                    builder: (BuildContext context) => GroupPage(),
                  );
                  break;
                case 2:
                  return CupertinoTabView(
                    navigatorKey: feedTabNavKey,
                    builder: (BuildContext context) => FeedPage(widget.currentUser),
                  );
                  break;
                case 3:
                  return CupertinoTabView(
                    navigatorKey: userTabNavKey,
                    builder: (BuildContext context) =>
                        UserPage(widget.currentUser?.uid),
                  );
                  break;
              }
              return null;
            },
          ),
        ),
      ),
    );
  }

  void sendTokenToServer(String fcmToken) {
    print('Token: $fcmToken');

    Firestore.instance.collection('pushtokens')
        .document(widget.currentUser.uid)
        .setData({
      'pushToken': fcmToken
    });
  }

  GlobalKey<NavigatorState> currentNavigatorKey() {
    switch (_selectedIndex) {
      case 0:
        return homeTabNavKey;
        break;
      case 1:
        return groupTabNavKey;
        break;
      case 2:
        return feedTabNavKey;
        break;
      case 3:
        return userTabNavKey;
        break;
    }

    return null;
  }

//
  Future<bool> _onWillPop() async {
    DateTime currentTime = DateTime.now();
    //Statement 1 Or statement2
    bool backButton = backbuttonpressedTime == null ||
        currentTime.difference(backbuttonpressedTime) > Duration(seconds: 2);
    if (backButton) {
      backbuttonpressedTime = currentTime;
      Fluttertoast.showToast(
          msg: "Double Click to exit app",
          backgroundColor: Colors.black,
          textColor: Colors.white);
      return false;
    }
    return true;
  }
}

谢谢！

Answer 1

在简单的情况下，当您需要拦截Android后退按钮时，通常会将WillPopScope添加到小部件树中。但是，在开发与后退按钮交互的有状态小部件时，使用BackButtonInterceptor更为方便。看看：

https://pub.dev/packages/back_button_interceptor