目录

flutter开发实战-当前界面无操作60s返回主页实现

flutter开发实战-当前界面无操作60s返回主页实现

当前界面无操作60s返回主页实现,主要是通过Timer来控制,当监听界面是否有pointerDown时候,如果超过60s仍没有操作,则返回主页。

一、Listener

Listener是用来用于调用回调以响应常见的指针事件

Listener的属性如下

复制代码
const Listener({
    super.key,
    this.onPointerDown,
    this.onPointerMove,
    this.onPointerUp,
    this.onPointerHover,
    this.onPointerCancel,
    this.onPointerPanZoomStart,
    this.onPointerPanZoomUpdate,
    this.onPointerPanZoomEnd,
    this.onPointerSignal,
    this.behavior = HitTestBehavior.deferToChild,
    super.child,
  }) : assert(behavior != null);

可以看出,我们可以通过onPointerDown来判断用户是否触摸到屏幕。

二、新增ListenerTouchTimerWrapper

为Widget添加Timer控制,当触摸了屏幕,取消Timer,重新倒计时。倒计时结束之后,可以执行callback。

复制代码
void updateTouch() {
    _timer?.cancel();

    if (timeoutCallback != null) {
      _timer = Timer(Duration(milliseconds: milliseconds), timeoutCallback!);
    }
  }

完整代码如下

复制代码
class ListenerTouchTimer {
  final int milliseconds;
  Timer? _timer;
  VoidCallback? timeoutCallback;

  ListenerTouchTimer({
    required this.milliseconds,
  });

  void startListener({required VoidCallback timeoutCallback}) {
    this.timeoutCallback = timeoutCallback;
    updateTouch();
  }

  void updateTouch() {
    _timer?.cancel();

    if (timeoutCallback != null) {
      _timer = Timer(Duration(milliseconds: milliseconds), timeoutCallback!);
    }
  }

  void dispose() {
    _timer?.cancel();
  }
}

为widget创建Wrapper

复制代码
/// 无操作回主页
class ListenerTouchTimerWrapper extends StatelessWidget {
  const ListenerTouchTimerWrapper({
    super.key,
    required this.child,
    this.listenerTouchTimer,
  });

  final Widget child;
  final ListenerTouchTimer? listenerTouchTimer;

  @override
  Widget build(BuildContext context) {
    return Listener(
      onPointerDown: (event) {
        if (listenerTouchTimer != null) {
          listenerTouchTimer!.updateTouch();
        }
      },
      child: child,
    );
  }
}

三、使用ListenerTouchTimerWrapper

在界面的外层使用ListenerTouchTimerWrapper进行包裹一下。

复制代码
class DemoPage extends StatefulWidget {
  const DemoPage({
    Key? key,
    required this.arguments,
  }) : super(key: key);

  final Map<String, dynamic> arguments;

  @override
  State<DemoPage> createState() => _DemoPageState();
}

class _DemoPageState extends State<DemoPage> {
  /// 超出60秒自动返回首页
  ListenerTouchTimer? listenerTouchTimer;
  @override
  void initState() {
    // TODO: implement initState
    getAppConfigFromNative();
    
    listenerTouchTimer = ListenerTouchTimer(milliseconds: 6000);
    super.initState();
    loggerInfo("ChangeClothe initState");
    if (listenerTouchTimer != null) {
      listenerTouchTimer!.startListener(timeoutCallback: () {
        print("_ChangeClotheWaitPageState 超出60秒自动返回首页");
        if (mounted ) {
          navigatorBack();
        }
      });
    }
  }

  @override
  void dispose() {
    // TODO: implement dispose
    loggerInfo("ChangeClothe dispose");
    listenerTouchTimer?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return ListenerTouchTimerWrapper(
      listenerTouchTimer: listenerTouchTimer,
      child: Scaffold(
        body: Container(),
      ),
    );
  }

  void navigatorBack() {
    NavigatorPageRouter.pop();
  }
}

四、小结

flutter开发实战-当前界面无操作60s返回主页实现

学习记录,每天不停进步。

本文是转载文章,点击查看原文
如有侵权,请联系 xyy@jishuzhan.net 删除
相关推荐
JarvanMo1 小时前
关于Flutter架构的小小探讨
前端·flutter
顾林海2 小时前
Flutter 图标和按钮组件
android·开发语言·前端·flutter·面试
yzwdzkn3 小时前
解决Flutter 2.10.5在升级Xcode 16后的各种报错
flutter·macos·xcode
亚洲小炫风5 小时前
flutter json解析增强
flutter·json·json兼容格式
SY.ZHOU5 小时前
Flutter 与原生通信
android·flutter·ios
恋猫de小郭8 小时前
IntelliJ IDEA 2025.1 发布 ,默认 K2 模式 | Android Studio 也将跟进
android·前端·flutter
梦想不只是梦与想9 小时前
鸿蒙系统开发状态更新字段区别对比
android·java·flutter·web·鸿蒙
RichardLai889 小时前
[Flutter学习之Dart基础] - 集合(List, Set,Map)
android·flutter
bst@微胖子9 小时前
Flutter项目之设置页
android·javascript·flutter
亚洲小炫风10 小时前
flutter 桌面应用之窗口自定义
flutter·桌面端程序