flutter 生命周期

在 上张贴 由 fkiwi, fkiwi发表回复

 

前言

如果你是 Android、iOS、React、Vue 的开发人员，那么你一定不会对生命周期感到陌生，当你在学习 Flutter 的时候，Flutter 也有自己的生命周期。本篇文章就讲讲 Flutter 的生命周期，从而知道应该在哪里来写业务逻辑。

Flutter 的生命周期

Flutter 的生命周期分为两个部分：

  1. Widget 的生命周期
  2. App 的生命周期

Flutter 里的 Widget 指的就是 View，所以 Widget 的生命周期就是 View 的创建和销毁等，但是如果你想知道 App 是在前台还是后台，这时就需要用到 App 的生命周期。

Widget 的生命周期

Flutter 里的 Widget 分为 StatelessWidget 和 StatefulWidget 两种，这两种 Widget 的生命周期是不一样的，我们接下来具体来看。

StatelessWidget 的生命周期

StatelessWidget 的生命周期只有一个，就是：

  • buildbuild 是用来创建 Widget 的，但因为 build 在每次界面刷新的时候都会调用，所以不要在 build 里写业务逻辑，可以把业务逻辑写到你的 StatelessWidget 的构造函数里。StatelessWidget 的 build 函数代码如下： 
    class TestWidget extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    print('StatelessWidget build');
    return Text('Test');
  }
}

StatefulWidget 的生命周期

StatefulWidget 的生命周期比较复杂，依次为：

  • createState
  • initState
  • didChangeDependencies
  • build
  • addPostFrameCallback
  • didUpdateWidget
  • deactivate
  • dispose

接下来具体介绍一下各个生命周期。

  • createStatecreateState 是 StatefulWidget 里创建 State 的方法，当要创建新的 StatefulWidget 的时候，会立即执行 createState，而且只执行一次，createState 必须要实现： 
    class MyScreen extends StatefulWidget {
  @override
  _MyScreenState createState() => _MyScreenState();
}
  • initState前面的 createState 是在创建 StatefulWidget 的时候会调用，initState 是 StatefulWidget 创建完后调用的第一个方法，而且只执行一次，类似于 Android 的 onCreate、iOS 的 viewDidLoad()，所以在这里 View 并没有渲染，但是这时 StatefulWidget 已经被加载到渲染树里了，这时 StatefulWidget 的 mount 的值会变为 true，直到 dispose 调用的时候才会变为 false。可以在 initState 里做一些初始化的操作。在 override initState 的时候必须要调用 super.initState()： 
    @override
void initState() {
  super.initState();
  ...
}
  • didChangeDependencies当 StatefulWidget 第一次创建的时候，didChangeDependencies 方法会在 initState 方法之后立即调用，之后当 StatefulWidget 刷新的时候，就不会调用了，除非你的 StatefulWidget 依赖的 InheritedWidget 发生变化之后，didChangeDependencies 才会调用，所以 didChangeDependencies 有可能会被调用多次。
  • build在 StatefulWidget 第一次创建的时候，build 方法会在 didChangeDependencies 方法之后立即调用，另外一种会调用 build 方法的场景是，每当 UI 需要重新渲染的时候，build 都会被调用，所以 build 会被多次调用，然后 返回要渲染的 Widget。千万不要在 build 里做除了创建 Widget 之外的操作，因为这个会影响 UI 的渲染效率。
  • addPostFrameCallbackaddPostFrameCallback 是 StatefulWidge 渲染结束的回调，只会被调用一次，之后 StatefulWidget 需要刷新 UI 也不会被调用，addPostFrameCallback 的使用方法是在 initState 里添加回调： 
    import 'package:flutter/scheduler.dart';
@override
void initState() {
  super.initState();
  SchedulerBinding.instance.addPostFrameCallback((_) => {});
}
  • didUpdateWidgetdidUpdateWidget 这个生命周期我们一般不会用到，只有在使用 key 对 Widget 进行复用的时候才会调用。
  • deactivate当要将 State 对象从渲染树中移除的时候，就会调用 deactivate 生命周期，这标志着 StatefulWidget 将要销毁，但是有时候 State 不会被销毁，而是重新插入到渲染树种。
  • dispose当 View 不需要再显示，从渲染树中移除的时候，State 就会永久的从渲染树中移除，就会调用 dispose 生命周期，这时候就可以在 dispose 里做一些取消监听、动画的操作，和 initState 是相反的。

App 的生命周期

如果想要知道 Flutter App 的生命周期，例如 Flutter 是在前台还是在后台，就需要使用到 WidgetsBindingObserver 了，使用方法如下：

  1. State 的类 mix WidgetsBindingObserver： 
    class _MyHomePageState extends State<MyHomePage> with WidgetsBindingObserver {
    ...
}
  2. 在 State 的 initState 里添加监听： 
    @override
  void initState(){
    super.initState();
    WidgetsBinding.instance.addObserver(this);
  }
  3. 在 State 的 dispose 里移除监听： 
      @override
  void dispose() {
    // TODO: implement dispose
    super.dispose();
    WidgetsBinding.instance.removeObserver(this);
  }
  4. 在 State 里 override didChangeAppLifecycleState 
    @override
void didChangeAppLifecycleState(AppLifecycleState state) {
  super.didChangeAppLifecycleState(state);
  if (state == AppLifecycleState.paused) {
    // went to Background
  }
  if (state == AppLifecycleState.resumed) {
    // came back to Foreground
  }
}

AppLifecycleState 就是 App 的生命周期，有：

  • resumed
  • inactive
  • paused
  • suspending

参考

medium.com/flutter-com…

 

 

mark：

https://juejin.cn/post/6844903874617147399