Flutter页面生命周期

基于StatefulWidget衍生出渲染页面层

基于StatelessWidget衍生出渲染普通(嵌入式小组件)层

StatelessWidget组件周期函数 : createElement/build函数

//StatefulWidget底层提供的周期事件(三阶段):
//①初始化期:createState,initState;
//②更新期:didChangeDependencies,build,didUpdateWidget
//③销毁期:deactivate失活,dispose安排 ;

dart 复制代码
//周期函数createState处于初始化期
  //周期函数createState自定义的StatefulWidget构造器内第一个调用事件
  //周期函数createState是抽象方函数(需重写)
  @override
  State<PageC> createState() => _PageCState();
  // _PageCState createState() => _PageCState();
dart 复制代码
@override
  //重构状态初始化initState事件实例
  //周期函数initState处于初始化期
  //周期函数initState是StatefulWidget构造器内第二个调用事件
  //类似于(IOS中viewDidLoad函数地位):所需数据源的初始载入
  //进入flutter页面层时触发一次
  void initState() {
    if (kDebugMode) {
      print("initState");
    }
    super.initState();

  }

  //周期函数didChangeDependencies处于更新阶段
  //周期函数didChangeDependencies是StatefulWidget构造器内第三个调用事件(调用完initState后)
  //InheritedWidget继承组件相关(暂不涉及)
  //didChangeDependencies已更改依赖项事件必须先调用父类(先变更父类依赖)
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    if (kDebugMode) {
      print("didChangeDependencies");
    }
  }
dart 复制代码
//周期函数build处于更新阶段
  //情形①常规:周期函数build是StatefulWidget构造器内第四个调用事件(调用完didChangeDependencies后)
  //情形②:setState事件被触发后, 周期函数build重新被调用(重新渲染页面)
  @override
  //状态SW插件子类的本身执行区中重构插件编译build事件实例(系统自动触发)
  Widget build(BuildContext context) {
  }
dart 复制代码
//周期函数didUpdateWidget处于更新阶段
  //周期函数didUpdateWidget只在当前组件的父组件出现重绘时被调用触发
  //不常被调用
  @override
  void didUpdateWidget(PageC oldWidget) {
    //更新状态相关代码
    super.didUpdateWidget(oldWidget);
    if (kDebugMode) {
      print("didUpdateWidget");
    }
    //当前widget与oldWidget进行对比,如不同则执行额外操作
    // widget.update()
  }

  //周期函数解除事件deactivate处于销毁阶段
  ///解除事件deactivate只有在组件被移除时才触发
  ///先触发解除事件deactivate再触发dispose销毁事件
  @override
  void deactivate() {
    super.deactivate();
    if (kDebugMode) {
      print("deactivate");
    }
  }

  ///周期函数dispose处于销毁阶段
  //组件被真正销毁时调用
  //dispose事件内进行资源的释放与销毁操作
  @override
  void dispose() {
    super.dispose();
    if (kDebugMode) {
      print("dispose");
    }
  }

四、相关资源

参考资料 :

Flutter 官网 : https://flutter.dev/

Flutter 插件下载地址 : https://pub.dev/packages

Flutter 开发文档 : https://flutter.cn/docs ( 强烈推荐 )

官方 GitHub 地址 : https://github.com/flutter

Flutter 中文社区 : https://flutter.cn/

Flutter 实用教程 : https://flutter.cn/docs/cookbook

Flutter CodeLab : https://codelabs.flutter-io.cn/

Dart 中文文档 : https://dart.cn/

Dart 开发者官网 : https://api.dart.dev/

Flutter 中文网 ( 非官方 , 翻译的很好 ) : https://flutterchina.club/ , http://flutter.axuer.com/docs/

Flutter 相关问题 : https://flutterchina.club/faq/ ( 入门阶段推荐看一遍 )

相关推荐
Miguo94well24 分钟前
Flutter框架跨平台鸿蒙开发——每日饮水APP的开发流程
flutter·华为·harmonyos
鸣弦artha1 小时前
Flutter框架跨平台鸿蒙开发——Image Widget加载状态管理
android·flutter
新镜1 小时前
【Flutter】Slider 自定义trackShape时最大最小值无法填满进度条问题
flutter
2501_944526421 小时前
Flutter for OpenHarmony 万能游戏库App实战 - 主题切换实现
android·开发语言·javascript·python·flutter·游戏·django
kirk_wang1 小时前
Flutter艺术探索-RESTful API集成:Flutter后端对接实战
flutter·移动开发·flutter教程·移动开发教程
某zhuan2 小时前
Flutter环境搭建(VS Code和Android Studio)
android·flutter·android studio
小雨下雨的雨2 小时前
触手可及的微观世界:基于 Flutter 的 3D 血细胞交互教学应用开发
flutter·3d·华为·矩阵·交互·harmonyos·鸿蒙系统
Miguo94well2 小时前
Flutter框架跨平台鸿蒙开发——结婚请柬生成器开发流程
flutter·华为·harmonyos
Miguo94well2 小时前
Flutter框架跨平台鸿蒙开发——记忆力练习APP开发流程
flutter·华为·harmonyos·鸿蒙
2501_944521592 小时前
Flutter for OpenHarmony 微动漫App实战:列表项组件实现
android·开发语言·javascript·flutter·ecmascript