Flutter 监听当前页面可见与隐藏状态

  • flutter 可以监听 app 进入前台还是后台状态,也可以监听当前某个页面 当前正在显示 还是 隐藏了

  • 找一个公共文件初始化一下 路由观察者,例如:

    • public.dart,只要能做成全局对象就行。

      dart 复制代码
      /// 路由观察者
      final routeObserver = RouteObserver<PageRoute>();
  • 有了 路由观察者 对象后,注册为导航监听者:

    • main.dart
    dart 复制代码
    /// MaterialApp
    Widget buildMaterialApp(BuildContext context) {
      // 这里直接在 MaterialApp 对象进行全局注册,其他模式也有,例如 CupertinoApp、WidgetsAp、Navigator
      return GetMaterialApp(
          title: 'Flutter Demo',
          // 注册
          navigatorObservers: [routeObserver],
        );
        ...
        ...
        ...
      }
    }
  • 页面使用,推荐封装作为底层 BaseStateful 使用,其他页面继承,可以随时打开,也可以单个页面使用:

    dart 复制代码
    import 'package:flutter/material.dart';
    import 'package:base_project/utils/public.dart';
    
    @immutable
    class BaseStatefulController extends StatefulWidget {
    
      const BaseStatefulController({super.key});
    
      @override
      State<BaseStatefulController> createState() => BaseStatefulControllerState();
    }
    
    class BaseStatefulControllerState extends State<BaseStatefulController> with RouteAware {
    
      /// 启用路由观察者
      bool enableRouteObserver = false;
    
      @override
      void initState() {
        super.initState();
        // 等待加载
        WidgetsBinding.instance.addPostFrameCallback((_) {
          // 初始化上下文完成
          initStateContext();
        });
      }
    
      /// 初始化上下文完成,可以在这里做一些需要上下文的初始化操作
      void initStateContext () {
        // 注册路由监听
        if (enableRouteObserver) {
          final route = ModalRoute.of(context);
          if (route is PageRoute) {
            routeObserver.subscribe(this, route);
          }
        }
      }
    
      @override
      void dispose() {
        // 取消路由监听
        routeObserver.unsubscribe(this);
        super.dispose();
      }
    
      @override
      void didPush() {
        print("页面被 push 到栈顶,页面可见");
      }
      @override
      void didPop() {
        print("页面被 pop,页面销毁");
      }
      @override
      void didPushNext() {
        print("有新页面 push 进来,当前页面进入不可见状态");
      }
      @override
      void didPopNext() {
        print("上一个页面被 pop,当前页面重新可见");
      }
    
      @override
      Widget build(BuildContext context) {
        return Container();
      }
    }
    方法 作用
    subscribe(routeAware, route) 订阅某个页面,监听生命周期变化
    unsubscribe(routeAware) 取消订阅,避免内存泄漏
    didPush() 页面进入可见
    didPop() 页面销毁
    didPushNext() 当前页面被覆盖,不可见
    didPopNext() 上一个页面被 pop,当前页面重新可见
相关推荐
我就是妖怪34 分钟前
KMP全栈开发:从Android到AI Agent的技术演进与实践
android·人工智能
心平气和量大福大2 小时前
android-实例-蒲公英-更新与安装-5-签名与生成APK
android·java·开发语言
阿pin3 小时前
Android随笔-Serializable与Parcelable
android·serializable·parcelable
天空之城--4 小时前
Android 事件分发机制深度解析——原理、源码与实战综合总结
android
大龄秃头程序员4 小时前
一次 Flutter 动画 Demo 的整理与复盘
flutter
阿pin4 小时前
Android随笔-AIDL
android·开发语言·aidl
2501_916007475 小时前
Bundle ID 注册与管理 App ID 创建指南 命名规则 权限开关与删除注意事项
android·ios·小程序·https·uni-app·iphone·webview
雨白5 小时前
面向对象六大基本原则实战:从零重构支持引擎切换的网络框架
android·架构
张赐荣6 小时前
Android TalkBack 无障碍优化: 为控件自定义转子导航动作
android·microsoft
AlexMaybeBot7 小时前
躺在沙发上开发 Openclaw 的移动端APP
前端·flutter