技术无止境,只怕不学习啊,Flutter 我们开始吧

flutter 是怎么刷新数据的刚开始接触的时候有点迷茫,经过一点探索原来是这个样子的。

在 Flutter 中,有两类常用的 Widget

无状态的 StatelessWidget

有状态的 StatefulWidget

StatelessWidget

StatelessWidget 是不能被改变的,比如:Icon、Text等。

如果控件一旦显示,就不需要再做任何的变更,那么使用 StatelessWidget。

class MyTestWidget extends StatelessWidget {

@override

Widget build(BuildContext context) {

return _buildMyTestWidget(context);

}

在 build() 中返回视图。

StatefulWidget

StatefulWidget 是有状态的,可变的。

可以改变外观,以响应用户的操作或者数据的变化。

StatefulWidget,是有一个设置状态的函数:

setState((){

// 更新状态、数据

})

调用这个函数后,就会触发 StatefulWidget 的视图树重建。

练习的例子就不写了,创建Flutter项目时候的例子中就有了。

State的生命周期

直接上图:

生命周期函数

说明

constructor

构造函数

initState

这个方法是组件创建后的第一个方法,它相当于原生的 onCreate 和 viewDidLoad,大部分页面初始逻辑调用会写到这个方法中。

didChangeDependencies

当 State 对象的依赖发生变化时会被调用。例:你的 StatefulWidget 依赖一个 InheritedWidget 的数据,当数据发生变化时,会调用子 Widget 的该方法。

第一次打开页面时 initState 之后会立刻调用该方法

build

这个方法是最为重要的一个方法,它用来构建你的整个组件树。

didUpdateWidget

当父组件改变并且需要重新绘制 UI 时,这个方法会调用。

通过这个方法,你可以通过参数获取到旧的组件,你可以通过对比新旧组件后做一些额外的逻辑。

deactivate

当 State 对象从树中被移除时,会调用此回调。有些情况下,framework 会将该 State 插入到树的其它部分。

dispose

当 State 对象从树中被永久移除时调用。通常在此回调中释放资源

reassemble

此回调是专门为了开发调试而提供的,在热重载(hot reload)时会被调用,此回调在 Release 模式下永远不会被调用

操作场景

场景 1:打开页面:

constructor

initState

didChangeDependencies

build

场景 2:退出页面:

deactivate

dispose

场景 3:热重载:

reassemble

didUpdateWidget

build

场景 4:前台转后台:

AppLifecycleState.inactive

AppLifecycleState.paused

场景 5:后台转前台:

AppLifecycleState.inactive

AppLifecycleState.resumed

场景 6:横竖屏切换

didUpdateWidget

build

didUpdateWidget

build

自己创建测试项目练习吧。

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐