如何重写Slidable组件默认onDismissed行为以阻止列表项被移除？

核心方案 #

直接将Slidable的dismissible参数设为false，就能彻底禁用滑动触发的列表项移除行为，同时保留ActionPane按钮和自定义滑动逻辑。

具体实现 #

1. 禁用默认移除行为

通过dismissible: false关闭Slidable自带的dismiss移除机制，避免滑动后列表项被删除。

2. 实现滑动修改属性

使用onSlideUpdate回调监听滑动进度，当滑动到指定阈值时执行属性修改逻辑，还可按需添加滑动复位逻辑。

3. 保留ActionPane按钮

正常配置actions和secondaryActions，按钮点击逻辑独立处理即可。

代码示例 #

Slidable(
  // 关键配置：禁用默认移除行为
  dismissible: false,
  // 监听滑动进度，触发属性修改
  onSlideUpdate: (slidePercent) {
    // 控制单次滑动只触发一次修改
    bool hasUpdated = false;
    
    // 向右滑动超过阈值时修改属性
    if (slidePercent > 0.1 && !hasUpdated) {
      setState(() {
        // 替换为你的列表项属性修改逻辑
        targetItem.status = Status.modified;
        hasUpdated = true;
      });
      // 可选：滑动后自动复位
      Future.delayed(const Duration(milliseconds: 300), () {
        setState(() => hasUpdated = false);
      });
    }
    // 向左滑动的逻辑同理
    else if (slidePercent < -0.1 && !hasUpdated) {
      setState(() {
        targetItem.anotherStatus = true;
        hasUpdated = true;
      });
      Future.delayed(const Duration(milliseconds: 300), () {
        setState(() => hasUpdated = false);
      });
    }
  },
  actionPane: const SlidableDrawerActionPane(),
  // 右侧滑动显示的操作按钮
  actions: [
    IconSlideAction(
      caption: '标记完成',
      color: Colors.green,
      icon: Icons.check_circle,
      onTap: () {
        setState(() => targetItem.isCompleted = true);
      },
    ),
  ],
  // 左侧滑动显示的操作按钮
  secondaryActions: [
    IconSlideAction(
      caption: '编辑',
      color: Colors.orange,
      icon: Icons.edit,
      onTap: () {
        // 执行编辑逻辑
      },
    ),
  ],
  child: ListTile(
    title: Text(targetItem.title),
    subtitle: Text(targetItem.status == Status.modified ? '已修改' : '未修改'),
  ),
)

补充说明 #

如果不需要滑动触发属性修改，仅需保留ActionPane按钮并阻止删除，只需设置dismissible: false，在按钮的onTap中处理业务逻辑即可。

内容的提问来源于stack exchange，提问作者Katya S