flutter系列之:用来管理复杂状态的State详解

简介

Flutter的基础是widget,根据是否需要跟用户进行交互,widget则可以分为StatelessWidget和StatefulWidget。StatelessWidget只能根据传入的状态进行简单的初始化widget,如果要实现跟用户交互这种复杂的功能,则需要用到StatefulWidget。

但是对于StatefulWidget本身来说,它并不存储任何状态,所有的状态都是存放在和StatefulWidget关联的State中的。

今天,让我们来探索一下StatefulWidget和State的关系。

StatefuWidget和State

StatefulWidget的定义很简单,它是一个abstract class,继承它只需要实现一个createState的方法:

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

  @override
  StatefulElement createElement() => StatefulElement(this);

  @protected
  @factory
  State createState(); 
}

注意,这里的createState是一个工厂类方法。这就意味着一个StatefulWidget可以创建多个State。

比如,如果从树中删除一个StatefulWidget,稍后再次将其插入到树中,Flutter将再次调用StatefulWidget.createState 来创建一个新的 State对象。

那么State中可以访问创建它的StatefulWidget吗?答案是肯定的。

在State中定义了一个T类型的widget, 这个T是StatefulWidget的子类:

abstract class State<T extends StatefulWidget> with Diagnosticable {
  T get widget => _widget!;
  T? _widget;

这里的_widget是不需要我们自行去设置的,这个_widget是由flutter框架在调用initState之前设置的。该_widget实际上就是和State关联的StatefulWidget。

我们可以直接在在State中使用widget来引用它。

State的生命周期

讲完StatefulWidget和State的关系之后,接下来我们来了解一下State是如何变化的,通俗的讲,就是State的生命周期是怎么样的。

通常来说,一个State的生命周期有4个状态,分别是created,initialized,ready和defunct状态,这四个状态是定义在枚举类_StateLifecycle中的:

enum _StateLifecycle {
  /// State已经被创建成功了,State.initState方法被调用。
  created,

  /// State.initState方法虽然被调用了,但是State对象还没有构建完毕。 这时候会调用State.didChangeDependencies方法.
  initialized,

  /// State对象创建成功,State.dispose方法还没有被调用。
  /// called.
  ready,

  /// State.dispose方法被调用过了,State对象不允许再调用build方法。
  defunct,
}

我们详细来讲解一下State的生命周期。

首先,flutter为了创建State对象,会调用StatefulWidget.createState方法。因为StatefulWidget.createState方法只是简单的new一个State对象,所以这个时候State对象就处于created的状态。

这个新创建的State对象会和一个BuildContext相关联.注意这个关联关系是永久性的,不会发生变化的。

虽然关联关系不会发生变化,但是BuildContext本身是可以在树上进行移动的。这时候的State处于mounted状态。

接下来,flutter会调用State中的 initState方法。

对于State的具体实现来说,需要重写这个initState的方法,根据和State关联的BuildContext和Widget来初始化State的状态。其中BuildContext和Widget可以通过使用State的context和widget属性来访问获取。

然后flutter框架会调用state的didChangeDependencies方法。

什么时候会去调用这个方法呢?根据flutter的说法,当State依赖的对象发生变化的时候就会调用。

举个例子,如果在State的build方法中引用了一个InheritedWidget对象,而这个InheritedWidget对象后来发生了变化。这个时候flutter就会调用didChangeDependencies方法。

我们看下State中该方法的定义:

  void didChangeDependencies() { }

可以看到这个方法本身是一个空的方法体,因为并不是抽象方法,所以子类并不需要强制实现它。

为什么一般来说State的子对象并不需要重写这个方法呢?这是因为flutter如果检测到依赖有变化的时候,会去调用State的build方法。通常来说,我们并不需要这么频繁的进行重构。

当然,也会有一些特殊的情况,比如实时网络通讯这种实时性要求很高的情况。

这个时候,State对象完全初始化完毕了,接着就可以无限次数调用build方法,来重构用户界面。

State还可以主动调用setState方法来重构子树。

除了State主动调用setState方法之外,还有一些外部的变动会导致State的变动,比如:

void didUpdateWidget(covariant T oldWidget) { }

这个方法什么时候会被调用呢?

我们知道Widget是不会变的,每个Widget都有一个唯一的key用来标记,但是parent Widget可以使用同一个key和runtimeType来对当前的widget进行修改。因为Widget是不变的,所以生成一个新的widget。这时候flutter就会调用State中的didUpdateWidget方法,并且将老的Widget作为参数传入。

注意,flutter框架会在调用didUpdateWidget之后自动调用build方法,所以我们在写程序的过程中,注意不要重复调用。

如果是在开发过程中,flutter还支持热重载,这时候会调用state的reassemble方法:

void reassemble() { }

flutter框架会在触发热重载之后,调用build方法,所以一般来说,我们并不需要重写reassemble方法。

刚刚我们提到了parent Widget可能修改当前Widget的配置文件,如果修改了当前Widget的key,那么老的widget就处于一个deactivate 的状态,widget中的deactivate 方法就会被调用:

  void deactivate() {
    super.deactivate();
    assert(
      !renderObject.attached,
      'A RenderObject was still attached when attempting to deactivate its '
      'RenderObjectElement: $renderObject',
    );
  }

我们可以重写这个方法,来处理一些资源的清理工作。

注意,现在这个widget是deactivate状态,但是并不意味这它就没有用了。因为flutter还可以将这个widget再重新插入对象树中,继续使用。reinsert是通过调用State对象的build方法来实现的。

这个操作只要是在一个animation frame结束之前操作都是可以的。这样做的好处就是,state还可以保留部分资源并不释放,从而提升效率。

最后,如果State确实是不需要使用了,就会调用State的dispose 方法:

  void dispose() {
    assert(_debugLifecycleState == _StateLifecycle.ready);
    assert(() {
      _debugLifecycleState = _StateLifecycle.defunct;
      return true;
    }());
  }

当State的dispose方法被调用之后,State就处于unmounted状态。这时候State的setState方法就不能再被调用了,这就表示State的生命周期结束了。

总结

以上就是State和State的生命周期相关的介绍。

更多内容请参考 http://www.flydean.com/03-flutter-state/

最通俗的解读,最深刻的干货,最简洁的教程,众多你不知道的小技巧等你来发现!

欢迎关注我的公众号:「程序那些事」,懂技术,更懂你!

原文地址:https://www.cnblogs.com/flydean/p/16612893.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


简介 java中使用jar包来封装有用的功能,然后将其分发到maven仓库中,供其他人使用。同样的在dart中也有类似的概念叫做packages。packages就是可以用来共享的软件包,可以包含libraries和tools。 你可以在pub.dev网站中查到dart中所有的共享packages的
简介 flutter是google在2015年dart开发者峰会上推出的一种开源的移动UI构建框架,使用flutter可以非常方便的编译成运行在原始android,ios,web等移动平台上的移动应用。 flutter是使用dart来编写的,最新的flutter版本是2.5.3,而最新的Dart语言
简介 dart作为一种面向对象的语言,class是必不可少的。dart中所有的class,除了Null都继承自Object class。 要想使用dart中的类就要构造类的实例,在dart中,一个类的构造函数有两种方式,一起来看看吧。 传统的构造函数 和JAVA一样,dart中可以使用和class名
简介 Exception是程序中的异常情况,在JAVA中exception有checked Exception和unchecked Exception。那么在dart中的情况是不是一样的呢?一起来看看吧。 Exception和Error Dart中表示异常的类有两个,分别是Exception和Err
简介 虽然dart中的类只能有一个父类,也就是单继承的,但是dart提供了mixin语法来绕过这样限制。 今天,和大家一起来探讨一下dart类中的继承。 使用extends 和JAVA一样,dart中可以定义一个父类,然后使用extends来继承他,得到一个子类,如下所示: class Studen
简介 pubspec.yaml是所有dart项目的灵魂,它包含了所有dart项目的依赖信息和其他元信息,所以pubspec.yaml就是dart项目的meta! pubspec.yaml支持的字段 根据dart的定义,pubspec.yaml中可以包含下面的字段: 字段名 是否必须字段 描述 nam
dart系列之:dart语言中的特殊操作符 简介 有运算就有操作符,dart中除了普通的算术运算的操作符之外,还有自定义的非常特殊的操作符,今天带大家一起来探索一下dart中的特殊操作符。 普通操作符 普通操作符就很好解释了,就是加减乘除,逻辑运算符,比较运算符和位运算符等。 这些操作符和其他语言的
简介 在dart系统中,有pubspec.yaml文件的应用就可以被成为一个package。而Libray package是一类特殊的package,这种包可以被其他的项目所依赖. 也就是通常所说的库。 如果你也想你写的dart程序可以上传到pub.dev上,或者提供给别人使用,则来看看这篇文章吧。
简介 和所有的编程语言一样,dart有他内置的语言类型,这些内置类型都继承自Object,当然这些内置类型是dart语言的基础,只有掌握了这些内置类型才能够在使用dart语言的时候得心应手。 今天就给大家讲解一下dart语言的内置类型。 Null 在dart中用null来表示空。那么null和Nul
简介 函数是所有编程语言都有的内容,不管是面向对象还是面向过程,函数都是非常重要的一部分。dart中的函数和java中的函数有什么区别呢? dart作为一种面向对象的编程语言,它的函数也是一个对象,用Function来表示。先看下函数的定义: abstract class Function { ex
简介 熟悉JAVA的朋友可能知道,JAVA在8中引入了泛型的概念。什么是泛型呢?泛型就是一种通用的类型格式,一般用在集合中,用来指定该集合中应该存储的对象格式。 有了泛型可以简化我们的编程,并且可以减少错误的产生,非常的方便。 dart语言中也有泛型。一起来看看吧。 为什么要用泛型 使用泛型的主要目
简介 熟悉javascript的朋友应该知道,在ES6中引入了await和async的语法,可以方便的进行异步编程,从而摆脱了回调地狱。dart作为一种新生的语言,没有理由不继承这种优秀的品质。很自然的,dart中也有await和async语言,一起来看看吧。 为什么要用异步编程 那么为什么要用异步
简介 要想熟悉一种语言,最简单的做法就是熟悉dart提供的各种核心库。dart为我们提供了包括dart:core,dart:async,dart:math,dart:convert,dart:html和dart:io这几种常用的库。 今天给大家介绍一下dart:core中的数字和字符串的使用。 数字
简介 ES6中在引入异步编程的同时,也引入了Generators,通过yield关键词来生成对应的数据。同样的dart也有yield关键词和生成器的概念。 什么时候生成器呢?所谓生成器就是一个能够持续产生某些数据的装置,也叫做generator。 两种返回类型的generator 根据是同步生成还是
简介 Flutter的基础是widget,根据是否需要跟用户进行交互,widget则可以分为StatelessWidget和StatefulWidget。StatelessWidget只能根据传入的状态进行简单的初始化widget,如果要实现跟用户交互这种复杂的功能,则需要用到StatefulWid
简介 时间和日期是我们经常会在程序中使用到的对象。但是对时间和日期的处理因为有不同时区的原因,所以一直以来都不是很好用。就像在java中,为时间和日期修改和新增了多次API,那么作为新生的语言dart而言,会有什么不一样的地方吗? dart中关于日期和时间的两个非常重要的类是DateTime和Dur
简介 Library是dart用来组织代码的一种非常有用的方式,通过定义不同的Library,可以将非常有用的dart代码进行封装,从而提供给其他的项目使用。虽然我们可以自由使用import或者export来对library进行导入和导入。但是什么样的用法才是最合适的用法呢? 一起来看看吧。 使用p
简介 dart中的集合有三个,分别是list,set和map。dart在dart:core包中提供了对于这三种集合非常有用的方法,一起来看看吧。 List的使用 首先是list的创建,可以创建空的list或者带值的list: var emptyList =[]; var nameList = [&#
简介 dart:html包为dart提供了构建浏览器客户端的一些必须的组件,之前我们提到了HTML和DOM的操作,除了这些之外,我们在浏览器端另一个常用的操作就是使用XMLHttpRequest去做异步HTTP资源的请求,也就是AJAX请求。 dart同样提供了类似JS中XMLHttpRequest
简介 Flutter是google开发的一个跨平台的UI构建工具,flutter目前最新的版本是3.0.5。使用flutter你可以使用一套代码搭建android,IOS,web和desktop等不同平台的应用。做到一次编写到处运行的目的。 说到一次编写处处运行,大家可能会想到java。那么flut