Flutter 入门与实战(六):给列表增加下拉刷新和上滑加载更多功能

本文介绍了如何在Flutter应用中使用flutter_easyrefresh库实现列表的下拉刷新和上滑加载更多功能。首先,通过在pubspec.yaml文件中引入依赖并执行flutter pub get。然后,将页面改造成有状态组件,使用EasyRefresh包裹ListView,并设置onRefresh和onLoad回调。最后,根据分页请求新数据并更新列表状态。
摘要由CSDN通过智能技术生成

return List<Map<String, Object>>.generate(size, (index) {
return {
‘title’: ‘标题${index + (page - 1) * size + 1}:这是一个列表标题,最多两行,多处部分将会被截取’,
‘imageUrl’:
‘https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3331308357,177638268&fm=26&gp=0.jpg’,
‘viewCount’: 180,
};
});
}

调用的时候,使用 await即可获取实际结果数据,如下所示:

// _currentPage 为当前页码,PAGE_SIZE为分页大小
List<Map<String, Object>> _newItems =
await DynamicMockData.list(_currentPage, PAGE_SIZE);

引入 flutter_easyrefresh

flutter 需要引入第三方插件时,需要在 pubspec.yaml 文件下的dependencies节点下增加依赖,撰写本文时flutter_easyrefresh的最新版为2.2.1,因此指定版本如下:

dependencies:
flutter:
sdk: flutter

cupertino_icons: ^1.0.2
flutter_easyrefresh: ^2.2.1

添加完依赖后,需要在项目目录执行 flu

  • 25
    点赞
  • 29
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值