FlutterDojo设计之道—状态管理之路(七,flutter插件播放音乐
class ItemModel {String title;bool isCheck;int likeCount;ItemModel(this.title, this.isCheck, this.likeCount);}class DataModel with ChangeNotifier {List dataList = List();int checkedCount = 0;bool shou
class ItemModel {
String title;
bool isCheck;
int likeCount;
ItemModel(this.title, this.isCheck, this.likeCount);
}
class DataModel with ChangeNotifier {
List dataList = List();
int checkedCount = 0;
bool shouldListRebuild = true;
getData(int pageIndex) async {
List items = await api.getListDataOfIndex(pageIndex);
shouldListRebuild = true;
dataList.addAll(items);
notifyListeners();
}
refreshData() {
dataList.clear();
checkedCount = 0;
shouldListRebuild = true;
notifyListeners();
}
updateChecked(int index, bool isChecked) {
shouldListRebuild = false;
var item = dataList[index];
if (isChecked) {
checkedCount++;
} else {
checkedCount–;
}
dataList[index] = ItemModel(item.title, isChecked, item.likeCount);
notifyListeners();
}
}
新增了几个函数,分别用于获取分页数据,刷新数据,更新Item的Checked状态。
改造ListItem选中的刷新逻辑
在之前的方案中,当我们点击一个Item做修改时,整个List都将Rebuild,通过Selector,可以根据属性筛选,过滤出需要刷新的Item。
当List内容固定时,不需要刷新整个List,只需要更新改变的Item。
在List的ItemBuilder中,我们做一个Selector筛选,筛选内容为dataList中的ItemModel,当在指定的Item中点击CheckBox后,model被更新,所以Selector的shouldRebuild被判断为true,所以这个Item就会被更新,而其它未点击的Item则因为没有改变所以不会被更新,这样就控制了List的刷新范围为被更新的Item,代码如下所示。
return ListView.builder(
itemBuilder: (context, index) {
return Selector<DataModel, ItemModel>(
selector: (context, value) => value.dataList[index],
builder: (BuildContext context, data, Widget child) {
debugPrint((‘Item $index rebuild’));
return Card(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Checkbox(
value: data.isCheck,
onChanged: (flag) {
dataModel.updateChecked(index, !data.isCheck);
}),
Text(data.title),
Spacer(),
Icon(Icons.favorite),
ConstrainedBox(
constraints: BoxConstraints(minWidth: 30),
child: Center(child: Text(data.likeCount.toString())),
),
],
),
),
);
},
);
},
itemCount: dataModel.dataList.length,
);
Item的刷新控制其实比较简单,也是Selector的通用解决方案,但是Selector的使用场景是固定数据的List。如果List的数据会发生改变,则Selector的使用则会存在问题,举个例子,我们大部分APP的List使用场景都包含刷新数据、加载分页数据这样两个过程,所以List的数据源是一直在变化的,当首页数据加载时,还可能需要展示一个Loading界面,因此,这些场景下,整个List是一定需要Rebuild的,这时候,一个Selector就无能为力了,但是,我们可以再增加一个Selector,用于控制List是否需要刷新,这样就可以在不同的场景下,精细控制List的刷新范围。
- 当列表数据不固定时,刷新整个List
- 当列表数据固定时,只刷新更新的Item
有了这样的思路,就可以理解前面的Model中为什么需要一个shouldListRebuild变量了吧,剩下的代码如下所示。
Expanded(
child: Selector<DataModel, DataModel>(
shouldRebuild: (pre, next) => pre.shouldListRebuild,
selector: (context, dataModel) => dataModel,
builder: (BuildContext context, DataModel dataModel, Widget child) {
if (dataModel.dataList.length > 0) {
return ListView.builder(
itemBuilder: (context, index) {
return Selector<DataModel, ItemModel>(
selector: (context, value) => value.dataList[index],
builder: (BuildContext context, data, Widget child)
这里一个技巧是Selector<DataModel, DataModel>,这里只借助了Selector的shouldRebuild功能,所以并没有对数据做筛选,完整的代码大家请参考Dojo中的实现。
flutter_dojo/category/backend/providerstate4widget.dart
实际上的操作就是在刷新和加载分页数据这些操作的时候,让shouldRebuild为true,而当只修改Item数据的时候,让shouldRebuild为false,这样就完整的控制了List的刷新范围。
综上
–
当然,这样的处理只针对于对性能极致要求的场景,大部分情况下,并不太需要考虑的这么细,对List的Rebuild并不会产生多大的性能开销,开发者需要针对不同的场景采用不同的方案,没有必要太过严苛的控制刷新。
更多内容,请关注我的个人网站——xuyisheng.top/
公众号:
学习分享,共勉
Android高级架构师进阶之路
题外话,我在阿里工作多年,深知技术改革和创新的方向,Android开发以其美观、快速、高效、开放等优势迅速俘获人心,但很多Android兴趣爱好者所需的进阶学习资料确实不太系统,完整。今天我把我搜集和整理的这份学习资料分享给有需要的人,若有关Android学习进阶可以与我在Android终极开发交流群一起讨论交流。 点击这里前往我的Git领取资料 的同时,还可以加入一个好的学习交流圈,何乐而不为呢?加入我们和我们一起吧!!
- Android进阶知识体系学习脑图

- Android进阶高级工程师学习全套手册

- 对标Android阿里P7,年薪50w+学习视频

- 大厂内部Android高频面试题,以及面试经历
upkZ-1645104949766)]
- 对标Android阿里P7,年薪50w+学习视频
[外链图片转存中…(img-z2GDxlBL-1645104949766)]
- 大厂内部Android高频面试题,以及面试经历

更多推荐



所有评论(0)