【交互 widget】 Flutter Dismissible

前天我也中招了，还好有些存货，不然就要断更了。希望都快点好起来吧。

Dismissible，一个可以用拖动的方式触发删除的 widget。

Dismissible 介绍

这是一个 StatefulWidget ，通过组合很多基础 widget 来实现功能。比如手势识别使用了GestureDetector，滑动效果使用了 SlideTransition，裁剪使用了 ClipRect 等等。这些基础 widget 之前都讲过了。有了这些组件的基础，学习 Dismissible 会很轻松。

使用 Dismissible

const Dismissible({
    required Key key,
    required this.child,
    this.background,
    this.secondaryBackground,
    this.confirmDismiss,
    this.onResize,
    this.onUpdate,
    this.onDismissed,
    this.direction = DismissDirection.horizontal,
    this.resizeDuration = const Duration(milliseconds: 300),
    this.dismissThresholds = const <DismissDirection, double>{},
    this.movementDuration = const Duration(milliseconds: 200),
    this.crossAxisEndOffset = 0.0,
    this.dragStartBehavior = DragStartBehavior.start,
    this.behavior = HitTestBehavior.opaque,
  }
复制代码

虽然参数比较多，但是不复杂。

key 是必须的

在之前的文章  flutter key 中已经详细解释过 key 作用。当 一个 widget 有很多兄弟的时候，key 可以唯一标识他的身份。因为我们要删除节点，删除后，其它的兄弟节点要重新找位置，如果没有 key，位置就都错了。

background 是背景 widget

默认向右滑的时候，就会显示 background widget。如果没有设置 secondaryBackground 向左滑也显示。

secondaryBackground 是背景 widget

默认向左滑的时候，就会显示 secondaryBackground widget。如果设置 secondaryBackground，必须设置 background。

confirmDismiss

typedef ConfirmDismissCallback = Future<bool?> Function(DismissDirection direction);
复制代码

给 widget 一个决定是否响应删除的机会。在  Future resolve 之前，widget 不能被再次拖动。如果返回  true ，onResize，onDismissed 会被执行。返回 false， widget 回到原来的位置。

onResize

当 widget size 改变的时候调用 onResize。比如当有 item 被删除的时候，size 就会改变。

onUpdate

wiget 被拖动的时候调用。例如，此回调可用于根据当前是否达到关闭阈值来更改 background widget 的颜色。

onDismissed

当 widget 被移除，并完成 resize 的时候调用 onDismissed。这时应该 setState 更新数据。

direction

决定如何滑动可以删除 item。默认是水平向左或向右。在水平方向也可以做限定，可以指定 DismissDirection.startToEnd，或DismissDirection.endToStart。这样就只有一个方向可以删除。

resizeDuration

resizeDuration 如果为 null，size 变化不会有动画，会立即调用 onDismissed,默认是  300ms。

dismissThresholds

final Map<DismissDirection, double> dismissThresholds;
复制代码

这是一个 map，可以设置各个方向的 值，默认是 0.4。表示 只有超 40% 距离才能触发 dismiss。如果设置为 1 ，表示在这个方向上不能触发 dismiss,即使 direction 已经允许了这个方向。

movementDuration

如果没有 dismiss 比如 confirmDismiss 返回 false，movementDuration 就是 widget 返回原来位置的时间。默认 200ms。不能为空，可以设置为 Duration.zero。

crossAxisEndOffset

如果 crossAxisEndOffset 不为 0，当滑动的时候，widgt 会沿着 cross 轴方向慢慢移动。正负决定了移动的方向。

dragStartBehavior

dragStartBehavior  有两个值， start，down。down 会让 dragStart 更早的发生。如果可以拖动的距离比较短可以设置此值。否则就默认的 start 就好。

behavior 在前面的 Listener 中已经详细讲过了。