Flutter 的 Widget 状态管理
2021-11-15 本文已影响0人
晨曦的简书
Widget 状态管理
在 iOS
中我们可以设置一个按钮不同状态下的 UI
展示效果。但是 flutter
的渲染原理是增量渲染,对于展示的 widegt
小部件的刷新都是创建新的替换原来旧的。所以对于 UI
部件来说是没有状态的,因为小部件都是新创建的,小部件的属性都是 final
属性。说明都是不能改变的,创建出来都是新的。所以对于 UI
部件来说就没有必要拥有状态。
但是对于一些复杂的页面,需要改变的地方非常多,或者数据来说如果没有状态就会非常不方便。例如我们需要保留一份数据,并且实时刷新界面的展示,这时候就需要状态来进行管理会比较方便。所以 flutter
就提供了一种有状态的 widget
类型。就是渲染逻辑跟数据逻辑是分开管理的,保留的是数据逻辑,但是 UI
都是实时新创建的。这两种逻辑在底层是分开管理的,但是渲染跟数据有时有关联的,所以 flutter
对这两种逻辑进行了封装,提供给我们的就是有状态的 widget
。下面我们通过一个案例来看一下。
class StateManagerDemo extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _SMDState();
}
}
class _SMDState extends State<StateManagerDemo> {
int count = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.grey[100],
appBar: AppBar(
title: const Text('StateDemo'),
),
body: Center(
child: Chip(label: Text('$count')),
),
floatingActionButton: FloatingActionButton(onPressed: (){
setState(() {
count += 1;
print('$count');
});
}, child: Icon(Icons.add)),
)
);
}
}
我们创建一个 StateManagerDemo
类,并为StateManagerDemo
类创建了一个专门负责状态管理的私有类 _SMDState
,也就是状态管理者。我们可以通过累加按钮对 count
进行累加,并实时刷新 count
的展示。外界并不能访问状态管理者,状态管理者为私有的,不能接收外部传递的数据。对外暴露的所有接口都放到 StateManagerDemo
类里面,每次点击累加按钮的时候就会调用一次 setState
方法,相当于重新调用 build
方法,对页面进行重新渲染。因为是增量渲染,所以每次只会重新创建 Text
部件。