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返回主页实现

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

相关推荐
叽哥2 小时前
dart学习第 20 节:错误处理与日志 —— 让程序更健壮
flutter·dart
TralyFang3 小时前
flutter key:ValueKey、ObjectKey、UniqueKey、GlobalKey的使用场景
flutter
叽哥3 小时前
dart学习第 19 节:元数据与反射 —— 代码的 “自我描述”
flutter·dart
叽哥4 小时前
dart学习第 15 节:Stream—— 处理连续数据流
flutter·dart
w_y_fan5 小时前
Flutter中蓝牙开发:flutter_blue_plus的应用理解
flutter
LZQ <=小氣鬼=>5 小时前
Flutter简单讲解
flutter
来来走走7 小时前
Flutter开发 StatelessWidget与StatefulWidget基本了解
android·flutter
LZQ <=小氣鬼=>8 小时前
Flutter 事件总线 Event Bus
flutter·dart·事件总线·event bus
天岚11 小时前
温故知新-SchedulerBinding
flutter
0wioiw013 小时前
Apple基础(Xcode⑤-Flutter-Singbox-AI提示词)
flutter·macos·xcode