dart ListTile onTap动画

hrirmatl  于 2023-04-27  发布在  其他
关注(0)|答案(1)|浏览(143)

我有一个ListTile视图,我打算添加一个用于删除和编辑详细信息的滑动功能。但是,用户不会知道此功能,可能会无意中滑动并删除或编辑项目。为了解决这个问题,我想在ListTile本身上添加一个点击动画,提供如何使用滑动功能的明确说明。有人可以帮助我吗?current design
类似这样的东西,并添加了一个简单的动画。looking for

wljmcqd8

wljmcqd81#

使用flutter_slidable package,当用户滑动ListTile时,它将显示可单击的textButtons,因此在用户单击按钮之前,它不会执行功能。
例如,像这样标记您的textButtons:

final startActionButtons = <Widget> [
   SlidableAction(
      label: 'Edit',
      foregroundColor: Colors.blue,
      icon: Icons.edit,
      onPressed: () => editItem(),
   ),
];
final endActionButtons = <Widget> [
   SlidableAction(
      label: 'Delte',
      foregroundColor: Colors.blue,
      icon: Icons.delete,
      onPressed: () => deleteItem(),
   ),
];

像这样使用widget:

Slidable(
  key: ValueKey(0),
  //swipe right:
  startActionPane: ActionPane(
     motion: const ScrollMotion(),
     extentRatio: 0.2,
     children: startActionButtons,
     ),
  //swipe left:
  endActionPane: ActionPane(
     motion: const ScrollMotion(),
     extentRatio: 0.2,
     children: startActionButtons,
  ),
  child: ListTile(),
),

相关问题