Widget生命周期

初始化生命
createState()
initState() :一般做一些初始化操作

更新
didChangeDependencies() 当State依赖发生改变时调用
build() 主要更新方法,一般只用来构建Widget,调用setState会重构此方法
didUpdateWidget()

销毁
deactivate() 当State对象从树中被移除时，会调用此回调
dispose() 当State对象从树中被永久移除时调用；通常在此回调中释放资源。

import 'package:flutter/material.dart';

/*
*  初始化
*  createState() initState()
*
* 更新
* didChangeDependencies()  build()  didUpdateWidget()
*
* 销毁
* deactivate()  dispose()
* */
//Flutter中Widget声明周期以及应用声明周期
class Flutter_Demo9 extends StatefulWidget {
  @override
  _Flutter_Demo9State createState() {
    _Flutter_Demo9State();
  }
}

class _Flutter_Demo9State extends State<Flutter_Demo9> {
  int _mTapIndex = 0;
  @override
  void initState() {
    // TODO: implement initState
    print("1028:---initState---");
    super.initState();
  }

  @override
  void didChangeDependencies() {
    // TODO: implement didChangeDependencies
    print("1028:---didChangeDependencies---");
    super.didChangeDependencies();
  }

  @override
  Widget build(BuildContext context) {
    print("1028:---build---");
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter中Widget声明周期以及应用声明周期"),
        leading: GestureDetector(
          onTap: () {
            returnPage();
          },
          child: BackButton(),
        ),
      ),
      body: Container(
        child:Column(
          children: <Widget>[
            GestureDetector(
              onTap: (){
                setState(() {
                  _mTapIndex ++;

                });
              },
              child: Icon(
                Icons.android,
                size: 100,
              ),
            ),
            Text('${_mTapIndex}'),
          ],
        )

      ),
    );
  }

  @override
  void didUpdateWidget(Flutter_Demo9 oldWidget) {
    print("1028:---didUpdateWidget---");
    super.didUpdateWidget(oldWidget);
  }

  @override
  void deactivate() {
    print("1028:---deactivate---");
    super.deactivate();
  }

  @override
  void dispose() {
    print("1028:---dispose---");
    super.dispose();
  }

  returnPage() {
    Navigator.pop(context);
  }
}

效果图:

点击跳转页面时初始化页面:

initState–>didChangeDependencies–>build

点击android黑色图标时调用了setState(){}方法重构build
点击了5次按钮,所以build调用了5次

咋们点击闪电按钮运行的时候,也是只运行build,不会在重新初始化

销毁
点击返回按钮, deactivate()–>dispose()

应用周期

• 1.需要用到WidgetsBindingObserver来监听应用生命周期
• 在initState()中绑定WidgetsBinding
• 从写WidgetsBindingObserver中的方法didChangeAppLifecycleState(AppLifecycleState state)来监听生命周期
• 在dispose()中解绑WidgetsBinding

import 'package:flutter/material.dart';


class Flutter_Demo9 extends StatefulWidget {
  @override
  _Flutter_Demo9State createState() => _Flutter_Demo9State();
}

//需要用到WidgetsBindingObserver来监听应用生命周期
class _Flutter_Demo9State extends State<Flutter_Demo9>  with WidgetsBindingObserver {
  int _mTapIndex = 0;
  @override
  void initState() {
    //绑定WidgetsBinding
    WidgetsBinding.instance.addObserver(this);
    super.initState();
  }

  @override
  void didChangeAppLifecycleState(AppLifecycleState state) {
    // TODO: implement didChangeAppLifecycleState
    super.didChangeAppLifecycleState(state);
    print("1028__staate: ${state}");
    if(state == AppLifecycleState.paused){
      print("didChangeAppLifecycleState:进入后台");
    }else if(state == AppLifecycleState.resumed){
      print("didChangeAppLifecycleState:进入前台");
    }else if(state == AppLifecycleState.inactive){
      //不常用  应用程序处于非活动状态,并且接收输入回调时调用 比如:接电话
      print("didChangeAppLifecycleState:inactive");
    }else if(state == AppLifecycleState.suspending){
      //不常用 应用程序被调起时调用 IOS不会触发
      print("didChangeAppLifecycleState:suspending");
    }
  }

  @override
  Widget build(BuildContext context) {
    print("1028:---build---");
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter中Widget声明周期以及应用声明周期"),
        leading: GestureDetector(
          onTap: () {
            returnPage();
          },
          child: BackButton(),
        ),
      ),
      body: Container(
        child:Column(
          children: <Widget>[
            GestureDetector(
              onTap: (){
                setState(() {
                  _mTapIndex ++;

                });
              },
              child: Icon(
                Icons.android,
                size: 100,
              ),
            ),
            Text('${_mTapIndex}'),
          ],
        )

      ),
    );
  }




  @override
  void dispose() {
    //解定WidgetsBinding
    WidgetsBinding.instance.removeObserver(this);
 
  }


}

进入后台效果:

Log显示:

进入前台效果:

Log显示:

完整代码

上一章:Flutter 如何进行Flutter点击事件响应和手势监听(1.5)

下一章:Flutter 手机拍照,选取照片功能实战

原创不易,您的点赞就是我最大的动力,请您留下您的点赞.谢谢啦~