Flutter监听当前页面可见与隐藏状态的代码详解

本文主要是介绍Flutter监听当前页面可见与隐藏状态的代码详解，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

《Flutter监听当前页面可见与隐藏状态的代码详解》文章介绍了如何在Flutter中使用路由观察者来监听应用进入前台或后台状态以及页面的显示和隐藏,并通过代码示例讲解的非常详细,需要的朋友可以参考下...

flutter 可以监听 app 进入前台还是后台状态，也可以监听当http://www.chinasem.cn前某个页面 当前正在显示 还是 隐藏了。
找一个公共文件初始化一下 路由观察者，例如：
- public.Dart，只要能做成全局对象就行。

/// 路由观察者
final routeObserver = RouteObserver<PageRoute>();

有了 路由观察者 对象后，注册为导航监听者：

main.dart

/// MaterialApp
Widget buildMaterialApp(BuildContext context) {
  // 这里直接在 MaterialApp 对象进行全局注册，其他模式也有，例如 CupertinoApp、WidgetsAp、Navigator
  return GetMaterialApp(
      title: 'Flutter Demo',
      // 注册
      navigatorObservers: [routeObserver],
    );
    ...
    ...
    ...
  }
}

页面使用，推荐封装作为底层 BaseStateful 使用，其他页面继承，可以随时打开，也可以单个页面使用：

import 'package:flutter/material.dart';
import 'package:base_project/utils/public.dart';

@immutable
class BaseStatefulController extends StatefulWidget {

http://www.chinasem.cn  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("页面被 pusandroidh 到栈顶，页面可见");
  }
  @override
  void didPop() {
    print("页面被 pop，页面销毁");
  }
  @override
  void didPushNext() {
    print("有新页面 push 进来，当前页面进入不可见状态android");
  }
  @override
  void didPopNext() {
    print("上一个页面被 pop，当前页面重新可见");
  }

  @override
  Widget build(BuildContext context) {
    return Container();
  }
}

方法	作用
`subscribe(routeAware, route)`	订阅某个页面，监听生命周期变化
`unsubscribe(routeAware)`	取消订阅，避免内存泄漏
`didPush()`	页面进入可见
`didPop()`	页面销毁
`didPushNext()`	当前页面被覆盖，不可见
`didPopNext()`	上一个页面被 `pop`，当前页面重新可见