Flutter Web：如何检测AppLifeCycleState的变化

Question

我在Flutter Web上测试了AppLifeCycleState，但是它没有在移动平台上工作。这是一个正在解决的问题。

我想知道有没有人知道任何解决方法或包可以做到这一点？

- user15782390

Answer 1

以下是我的解决方案

import 'dart:html';
import 'package:flutter/foundation.dart';

  // inside your State class

  @override
  void initState() {
    super.initState();
    if (kIsWeb) {
      window.addEventListener('focus', onFocus);
      window.addEventListener('blur', onBlur);
    } else {
      WidgetsBinding.instance!.addObserver(this);
    }
  }

  @override
  void dispose() {
    if (kIsWeb) {
      window.removeEventListener('focus', onFocus);
      window.removeEventListener('blur', onBlur);
    } else {
      WidgetsBinding.instance!.removeObserver(this);
    }
    super.dispose();
  }

  void onFocus(Event e) {
    didChangeAppLifecycleState(AppLifecycleState.resumed);
  }

  void onBlur(Event e) {
    didChangeAppLifecycleState(AppLifecycleState.paused);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    // do your thing
  }

基本上，您需要挂钩浏览器的可见性API并自己调用生命周期回调函数。

另请参见如何检测Flutter网站是否在浏览器的后台运行？

- contrasting

---

抱歉，我没有使用 WidgetsBindingObserver 扩展类，错误已经消失了。我现在会进行测试。 - user15782390

就像上面一样，但是你要钩入浏览器的焦点API。 - contrasting

另外，在上面的代码中，代码没有正确处理并且 didChangeAppLifecycleState() 仍在运行。 - user15782390

正常调用dispose方法（通过弹出路由）仍然无法解决问题。 - user15782390

你在哪里添加静态修饰符？ - user15782390