第八十二回：Widget的生命周期

原创已于 2023-07-14 06:45:32 修改 · 314 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#Flutter生命周期 #initState #dispose

于 2023-07-13 23:59:47 首次发布

一起Talk Flutter吧专栏收录该内容

961 篇文章

订阅专栏

文章介绍了Flutter中StatefulWidget的生命周期，包括initState()用于初始化，build()用于构建Widget，以及dispose()用于释放资源。通过示例代码展示了这三个关键生命周期方法的使用，并提示读者可以结合Android或iOS的生命周期知识进行对比理解。

我们在上一章回中介绍了Flutter中如何使用三方包相关的内容，本章回中将介绍 Widget的生命周期.闲话休提，让我们一起Talk Flutter吧。

概念介绍

本章回中介绍的生命周期是指Widget从创建到结果的整个过程，这里提到的Widget是一个泛称，更加准确的说是StatefulWidget，因为StatelessWidget没有具体的State。

在程序开发过程中需要明白Widget的生命周期，这样才能生命周期中不同的阶段做不同的事情，常见是在创建Widget时初始化某些数据，在销毁Widget时释放相关的资源。

使用方法

生命周期是一个抽象的概念，不容易操作，不过不用担心，Flutter在生命周期中不同的阶段提供了不同的回调方法，我们称其为生命周期回调方法。我们只需要使用生命周期回调方法就可以去完全生命中相关的操作。接下来我们介绍相关的生命周期方法：

initState()方法：主要用来初始化Widget相关的内容；
build()方法：主要用来创建Widget，它不可以创建子Widget；
dispose()方法：主要用来释放Widget相关的资源；

我们在这里只介绍了三个重要的生命周期方法，其它的生命周期方法先不介绍，后续遇到后再做详细介绍。如果看官们有Android或者IOS的开发经验，那么可以使用这两个平台中生命周期的概念来对比，以及这两个平台中相关的的生命周期回调方法来做对比，比如onCreate,onResume,willApper,DidLoad等生命周期方法。

示例代码


class ExLoadingPage extends StatefulWidget {
  const ExLoadingPage({Key? key}) : super(key: key);

  @override
  State<ExLoadingPage> createState() => _ExLoadingPageState();
}

class _ExLoadingPageState extends State<ExLoadingPage> {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print("Widget Circle: initState");
  }

  @override
  Widget build(BuildContext context) {
    print("Widget Circle: build");

    return Container(
      child: Image.asset("images/ex.png"),
    );
  }

  @override
  void dispose() {
    print("Widget Circle: dispose");
    super.dispose();
  }
}

编译并且运行上面的程序可以得到以下运行结果。注意：在运行过程中需要使用路由来切换页面，不然无法走到dispose这个生命周期方法中：

I/flutter ( 9836): Widget Circle: initState
I/flutter ( 9836): Widget Circle: build
I/flutter ( 9836): Widget Circle: dispose

看官们，关于"Widget生命周期"相关的内容就介绍到这里，欢迎大家在评论区交流与讨论!