flutter开发实战-手势Gesture与ListView滚动竞技场的可滑动关闭组件
import 'package:flutter/material.dart';
class SlidableDismissibleListView extends StatefulWidget {
@override
_SlidableDismissibleListViewState createState() => _SlidableDismissibleListViewState();
}
class _SlidableDismissibleListViewState extends State<SlidableDismissibleListView> {
final items = List<String>.generate(30, (i) => 'Item ${i + 1}');
@override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {
final item = items[index];
return Dismissible(
key: ValueKey(item),
onDismissed: (direction) {
setState(() {
items.removeAt(index);
});
},
child: Slidable(
actionPane: SlidableDrawerActionPane(),
actionExtentRatio: 0.25,
child: ListTile(title: Text(item)),
actions: <Widget>[
IconSlideAction(
icon: Icons.delete,
color: Colors.red,
onTap: () {},
),
IconSlideAction(
icon: Icons.archive,
color: Colors.blue,
onTap: () {},
),
],
),
);
},
);
}
}
这个代码实例展示了如何在Flutter中结合使用Dismissible
和Slidable
组件,实现一个可以通过滑动来删除列表项的列表。Dismissible
负责处理滑动事件,而Slidable
负责显示滑出后可进行的操作按钮。这个例子简洁明了,并且使用了ListView.builder来优化长列表的性能。
评论已关闭