Flutter开发之——动画-列表动画AnimatedList

---

2.1 构造函数

class AnimatedList extends StatefulWidget

const AnimatedList({

Key? key,

required this.itemBuilder,

th
is.initialItemCount = 0,

this.scrollDirection = Axis.vertical,

this.reverse = false,

this.controller,

this.primary,

this.physics,

this.shrinkWrap = false,

this.padding,

})

2.2 常用属性

| 属性 | 说明 | 取值 |

| :-: | :-: | :-: |

| key | 组件的标识符 | Key |

| itemBuilder | 生成每个列表的回调函数 | Widget Function(BuildContext context, int index, Animation animation) |

| initialItemCount | 创建时的item个数 | int |

| scrollDirection | 滚动方向，默认垂直 | Axis |

| controller | scroll控制器 | ScrollController |

三 数据的变化(添加或删除)

---

3.1 数据的增加

过程描述

• 数据增加时，将增加的数据添加到集合中

• AnimatedListState刷新动画变化结果

代码描述

List().insert(_index, _index);//集合变化

AnimatedList.of(context).insertItem(_index);//动画刷新

3.2 数据减少

过程描述

• 数据减少时，将减少的数据从集合中移除

• AnimatedListState刷新动画变化结果

代码描述

List().removeAt(_index);

AnimatedList.of(context).removeItem(index, (context,animation)=>{});

3.3 AnimatedList.of(context)替换

因为设计到状态切换，使用AnimatedListState替换AnimatedList.of(context)

final GlobalKey _listKey = GlobalKey();

四 示例(默认列表)

---

4.1 代码

List _list = [0,1];

body:AnimatedList(

initialItemCount: _list.length,

itemBuilder: (BuildContext context,int index,Animation animation){

return _buildItem(_list[index].toString(), animation);

},

)

Widget _buildItem(String _item,Animation _animation){

return Card(child: ListTile(title: Text(_item),) ,);

}

4.2 效果图

五 示例-添加/删除

---

5.1 代码

//定义变量

List _list = [0,1];

final GlobalKey _listKey=GlobalKey();

//试图

body:AnimatedList(

key: _listKey,

initialItemCount: _list.length,

itemBuilder: (BuildContext context,int index,Animation animation){

return _buildItem(_list[index].toString(), animation);

},

),

floatingActionButton: Row(

mainAxisAlignment: MainAxisAlignment.center,

crossAxisAlignment: CrossAxisAlignment.center,

children: [

FloatingActionButton(onPressed: ()=>_addItem(),child: Icon(Icons.add),),

SizedBox(width: 60,),

FloatingActionButton(onPressed: ()=>_removeItem(),child: Icon(Icons.remove),)

],

)

//方法

最后

小编这些年深知大多数初中级Android工程师，想要提升自己，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此我收集整理了一份《2024年Android移动开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

如果你需要这些资料， ⬅ 专栏获取
mg-CkwbVRQN-1719185593372)]

[外链图片转存中…(img-wtvP7vf6-1719185593373)]

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频，并且后续会持续更新

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人

都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

如果你需要这些资料， ⬅ 专栏获取