效果
https://ucc.alicdn.com/images/user-upload-01/20190801172905657.gif
构建List
body: ListView.builder( itemCount: articleDatas.length, itemBuilder: (BuildContext context, int position) { return getRow(position); }, ),
articleDatas是list数据源,可自行创建测试数据。
getRow方法是构建list的item布局,可以是复杂的也可以只是一个text。
添加滑动
官方有一个Dismissible Widget,包裹住item即可实现滑动效果。
final item = articleDatas[position]; return Dismissible( // 滑动背景色 background: new Container(color: Theme.of(context).primaryColor), // 设置key标识 key: new Key(item.title), // 滑动回调 onDismissed: (direction) { // 根据位置移除 articleDatas.removeAt(position); //do something // 提示 Scaffold.of(context).showSnackBar(SnackBar(content: Text("已移除"))); }, child: getRow(position), );
github
https://github.com/yechaoa/wanandroid_flutter
官方文档:https://flutter.dev/docs/cookbook/gestures/dismissible
滑出来点击再删除推荐:https://github.com/letsar/flutter_slidable