Flutter 的生命週期

前言

若是你是 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 的生命週期只有一個，就是：

• build

  build 是用來建立 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

接下來具體介紹一下各個生命週期。

• createState

  createState 是 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 的渲染效率。

• addPostFrameCallback

  addPostFrameCallback 是 StatefulWidge 渲染結束的回調，只會被調用一次，以後 StatefulWidget 須要刷新 UI 也不會被調用，addPostFrameCallback 的使用方法是在 initState 裏添加回調：

  import 'package:flutter/scheduler.dart';
  @override
  void initState() {
    super.initState();
    SchedulerBinding.instance.addPostFrameCallback((_) => {});
  }
  複製代碼

• didUpdateWidget

  didUpdateWidget 這個生命週期咱們通常不會用到，只有在使用 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