Flutter 滑动删除

简介: Flutter 滑动删除

效果


https://ucc.alicdn.com/images/user-upload-01/20190801172905657.gif

构建List


body: ListView.builder(
        itemCount: articleDatas.length,
        itemBuilder: (BuildContext context, int position) {
          return getRow(position);
        },
      ),


articleDatas是list数据源,可自行创建测试数据。

getRow方法是构建list的item布局,可以是复杂的也可以只是一个text。



添加滑动

官方有一个Dismissible Widget,包裹住item即可实现滑动效果。

          final item = articleDatas[position];
          return Dismissible(
            // 滑动背景色
            background: new Container(color: Theme.of(context).primaryColor),
            // 设置key标识
            key: new Key(item.title),
            // 滑动回调
            onDismissed: (direction) {
              // 根据位置移除
              articleDatas.removeAt(position);
              //do something
              // 提示
              Scaffold.of(context).showSnackBar(SnackBar(content: Text("已移除")));
            },
            child: getRow(position),
          );

github

https://github.com/yechaoa/wanandroid_flutter


官方文档:https://flutter.dev/docs/cookbook/gestures/dismissible

滑出来点击再删除推荐:https://github.com/letsar/flutter_slidable


目录
相关文章
|
前端开发 机器人 数据安全/隐私保护
Flutter笔记:手写并发布一个人机滑动验证码插件
写 Flutter 项目时,遇到需要滑块验证码功能。滑块验证码属于人机验证码的一种,看起来像是在一个图片中“挖去”了一块,然后通过用户手动操作滑块,让被“挖去”的部分移回来。由于我不想使用各种第三方模块,因此决定自己实现一个初版以后慢慢添砖加瓦。本文是对第一个版本的一点记录。
662 1
Flutter笔记:手写并发布一个人机滑动验证码插件
Flutter ListView懒加载(滑动不加载,停止滑动加载)
前言:为了更好的减小网络的带宽,使得列表更加流畅,我们需要了解懒加载,也称延迟加载。关于上一章的登录界面,各位属实难为我了,我也在求ui小姐姐,各位点点赞给我点动力吧~
|
容器
Flutter 108: 图解 PageView 滑动页面预览小尝试
0 基础学习 Flutter,第一百零八步:学习一下 PageView 的基本应用!
1597 1
Flutter ScrollView嵌套ListView滑动冲突
Flutter ScrollView嵌套ListView滑动冲突
1431 0
Flutter 121: 图解简易 Slider 滑动条
0 基础学习 Flutter,第一百二十一步:简单学习 Slider 滑动条!
1824 0
Flutter 121: 图解简易 Slider 滑动条
|
11月前
|
Dart 前端开发 容器
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
368 18
【07】flutter完成主页-完成底部菜单栏并且做自定义组件-完整短视频仿抖音上下滑动页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草央千澈
|
UED
Flutter之ListView实现自动滑动到底部
Flutter之ListView实现自动滑动到底部
571 1
Flutter 底部导航栏BottomNavigationBar,并关联PageView实现滑动切换
Flutter 底部导航栏BottomNavigationBar,并关联PageView实现滑动切换
455 0
重识Flutter 用于解决复杂滑动视窗问题的Slivers - part1
在日常的开发工作中,仅仅使用ListView、ListView.builder等这样的滑动组件就能满足大部分的业务需求,但在碰到较为复杂的滑动页面时,我认为Slivers可以帮你更简单的实现。
重识Flutter  用于解决复杂滑动视窗问题的Slivers - part1
|
iOS开发 容器
重识Flutter 在不同的滑动列表场景,请选择合适的Slivers - part2
在Flutter中,碰到复杂的、不同的滑动业务场景,若是选择了一个合适的Slivers组件,那么我认为问题会变得简单!
重识Flutter 在不同的滑动列表场景,请选择合适的Slivers - part2

热门文章

最新文章