Android

关注公众号 jb51net

关闭
首页 > 软件编程 > Android > Flutter监听当前页面

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

作者：卡尔特斯

文章介绍了如何在Flutter中使用路由观察者来监听应用进入前台或后台状态以及页面的显示和隐藏,并通过代码示例讲解的非常详细,需要的朋友可以参考下
/// 路由观察者
final routeObserver = RouteObserver<PageRoute>();

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

/// 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 {

  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，当前页面重新可见

以上就是Flutter监听当前页面可见与隐藏状态的代码详解的详细内容，更多关于Flutter监听当前页面的资料请关注脚本之家其它相关文章！

您可能感兴趣的文章:
阅读全文