Flutter Dismissible 拖动小部件

最新推荐文章于 2025-09-24 14:27:13 发布

原创最新推荐文章于 2025-09-24 14:27:13 发布 · 1.9k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#Flutter Dismissible 拖动小部件 #Flutter Dismissible #Flutter拖动小部件

Flutter 基础专栏收录该内容

73 篇文章

订阅专栏

本文详细介绍了Flutter中Dismissible小部件的使用方法及参数配置，包括child、background、secondaryBackground等属性，以及confirmDismiss、onResize、onDismissed等回调函数。通过示例代码展示了如何在ListView中使用Dismissible实现滑动删除功能。

部署运行你感兴趣的模型镜像

Dismissible 拖动小部件，可以通过在指示的方向拖动来小部件。拖动或投掷此小部件会导致子窗体滑出视图。

参数详解

属性	说明
child	子组件
background	滑动时组件下一层显示的内容没有设置secondaryBackground时，从右往左或者从左往右滑动都显示该内容设置了secondaryBackground后，从左往右滑动显示该内容，从右往左滑动显示secondaryBackground的内容
secondaryBackground	不能单独设置，只能在已经设置了background后才能设置，从右往左滑动时显示
confirmDismiss	组件消失前回调，可以弹出是否消失确认窗口。
onResize	组件大小改变时回调
onDismissed	组件消失后回调
direction	滑动方向（水平、垂直）默认DismissDirection.horizontal 水平
resizeDuration	组件大小改变的时长，默认300毫秒。Duration(milliseconds: 300)
dismissThresholds	必须拖动项目的偏移阈值才能被视为已解除
movementDuration	组件消失的时长，默认200毫秒。Duration(milliseconds: 200)
crossAxisEndOffset	滑动时偏移量，默认0.0，
dragStartBehavior	拖动消失后组件大小改变方式 start：下面组件向上滑动 down：上面组件向下滑动默认DragStartBehavior.start

代码示例

Dismissible 拖动小部件使用起来非常简单，创建ListView，listItem使用Dismissible为父组件即可。

body: ListView.builder(
  itemCount: list.length,
  itemBuilder: (context, index) {
    var item = list[index];
    return Dismissible(
      background: Container(color: Colors.red,),
      secondaryBackground: Container(color: Colors.green,),
      dragStartBehavior:DragStartBehavior.start,
      key: Key(item),
      child: ListTile(
        title: Text(item),
      ),
    );
  }
)

我们可以利用confirmDismiss添加dialog确认窗。

创建MyAlertDialog类的目的是，确认框中有Checkbox，需要做局部刷新。