4

如何使用HookWidget从特定页面监控应用程序的生命周期状态，就像使用Stateful 小部件一样？

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void dispose() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    super.didChangeAppLifecycleState(state);
    if (state == AppLifecycleState.paused) {
         ...
    }
    if (state == AppLifecycleState.resumed) {
        ...
    }
    if (state == AppLifecycleState.detached) {
       ...
    }
  }
4

4 回答 4

4

首先做一个类：

class MyObserver implements WidgetsBindingObserver {
}

然后创建它并注册它：

Widget build(BuildContext) {
  useEffect(() {
    final observer = MyObserver();
    WidgetsBinding.instance.addObserver(observer);
    return () => WidgetsBinding.instance.removeObserver(observer);
  }, const []);

  ...
}
于 2020-07-03T05:41:47.400 回答
3

在此处的文档中搜索“创建钩子的方法”。您将看到有 2 种创建钩子的方法，使用函数或使用类。您将选择“使用课程”。然后使用 initHook 覆盖作为您的 initState 和 dispose 工作相同。这就是我最终实现它的方式。

import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';

useWidgetLifecycleObserver(BuildContext context) {
  return use(const _WidgetObserver());
}

class _WidgetObserver extends Hook<void> {
  const _WidgetObserver();

  @override
  HookState<void, Hook<void>> createState() {
    return _WidgetObserverState();
  }
}

class _WidgetObserverState extends HookState<void, _WidgetObserver> with WidgetsBindingObserver {
  @override
  void build(BuildContext context) {}

  @override
  void initHook() {
    super.initHook();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    super.dispose();
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    print("app state now is $state");
    super.didChangeAppLifecycleState(state);
  }
}

然后

class Root extends HookWidget {

  @override
  Widget build(BuildContext context) {
    useWidgetLifecycleObserver(context);
于 2020-12-14T07:05:43.717 回答
0

我刚刚不得不处理同样的问题。这是我使用客户挂钩的解决方案

    import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';

AppLifecycleState useAppLifecycleState() {
  return use(const _LifeCycleState());
}

class _LifeCycleState extends Hook<AppLifecycleState> {
  const _LifeCycleState();

  @override
  __LifeCycleState createState() => __LifeCycleState();
}

class __LifeCycleState extends HookState<AppLifecycleState, _LifeCycleState>
    with WidgetsBindingObserver {
  AppLifecycleState _theState;

  @override
  void initHook() {
    super.initHook();
    WidgetsBinding.instance.addObserver(this);
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    super.didChangeAppLifecycleState(state);
    setState(() {
      _theState = state;
    });
  }

  @override
  AppLifecycleState build(BuildContext context) {
    return _theState;
  }

  @override
  void dispose() {
    super.dispose();
    WidgetsBinding.instance.removeObserver(this);
  }
}

在您想要访问应用程序生命周期状态的 HookWidget 中，使用 useEffect ：

final appLifecycleState = useAppLifecycleState();

useEffect(() {
  print("current app state");
  print(appLifecycleState);
  if (appLifecycleState == AppLifecycleState.paused ||
      appLifecycleState == AppLifecycleState.inactive) {
    //...
  } else if (appLifecycleState == AppLifecycleState.resumed) {
    //...
  }
  return null;
}, [appLifecycleState]);
于 2021-01-27T15:46:04.530 回答
0

Flutter hooks 附带一个内置的didchangeapplifecycle 访问权限，如下所示

    final appLifecycleState = useAppLifecycleState();

    useEffect(() {
      print("current app state");
      print(appLifecycleState);
      if (appLifecycleState == AppLifecycleState.paused || appLifecycleState == AppLifecycleState.inactive) {
        //...
      } else if (appLifecycleState == AppLifecycleState.resumed) {
        //...
      }
      return null;
    }, [appLifecycleState]);
于 2022-01-10T05:10:19.043 回答