重庆分公司,新征程启航

为企业提供网站建设、域名注册、服务器等服务

下拉刷新flutter,下拉刷新查看

Flutter下拉刷新、上拉加载

注意: 滚动组件添加: physics: ClampingScrollPhysics() 可以处理IOS系统的物理滚动的效果(即橡皮筋效果)

创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于网站设计制作、成都网站建设、雅安网络推广、微信平台小程序开发、雅安网络营销、雅安企业策划、雅安品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联公司为所有大学生创业者提供雅安建站搭建服务,24小时服务热线:13518219792,官方网址:www.cdcxhl.com

ListView 是最常用的可滚动组件之一,可以沿一个方向线性排布所有子组件,并且它也支持基于Sliver的延迟构建模型

默认构造函数:

ListView.builder:

ListView.separated:

ListView.separated 可以在生成的列表项之间添加一个分割组件,它比 ListView.builder 多了一个 separatorBuilder 参数,该参数是一个分割组件生成器。

RefreshIndicator 下拉刷新:

RefreshIndicator 是 Material 风格的下拉刷新组件。

CupertinoSliverRefreshControl 下拉刷新:

CupertinoSliverRefreshControl 是 ios 风格的下拉刷新控件。

上拉加载的功能,需要用到 ScrollController + ListView组件:

Flutter 扩展NestedScrollView (三)下拉刷新的解决

但是在使用官方的下拉刷新 RefreshIndicator 发现没法使用。

默默打开了源码,我们再来看一看。

首先,我调试到这个,发现notification.depth不为0,其实也好理解,因为NestedScrollView里面有很多能滚动的东西。默认的RefreshIndicator要求的是必须是第一层的它才其效果。

那么我改成,再试试呢?

在_handleScrollNotification方法中,我们可以看到会有很多ScrollNotification进来,不同的,当你滑动在一个不能滚动的list里面的时候,获取的viewportDimension是为0.。这会覆盖掉之前有viewportDimension的值。

所以我做了以下改动

对于NestedScrollView 来说。我们只需要关注最大能滚动viewportDimension,用这个来驱动整个下拉刷新.

用法跟官方一致

最后放上 Github extended_nested_scroll_view ,如果你有更好的方式解决这个问题或者有什么不明白的地方,都请告诉我,由衷感谢。

Flutter 下拉刷新、上拉加载flutter_easyrefresh的使用

flutter_easyrefresh: ^2.0.5

Pub get一下

下面我就以flutter_easyrefresh这个插件进行讲解。

[参照]{ }

Flutter listview下拉刷新,上拉加载更多封装

本文在 pull_to_refresh 的基础上对刷新做了封装,可以根据刷新状态自定义想要的头和尾。

本文刷新头和尾都使用的 lottie 动画,

lottie动画可以参考

接下来就可以在需要使用list view刷新的页面使用了 如下:

效果图:


名称栏目:下拉刷新flutter,下拉刷新查看
链接地址:http://cqcxhl.cn/article/hoigjp.html

其他资讯

在线咨询
服务热线
服务热线:028-86922220
TOP