
本文介绍了Flutter 实现下拉刷新上拉加载的示例代码,分享给大家,具体如下:
效果图
使用方法
添加依赖
dependencIEs: pull_to_refresh: ^1.5.7
导入包
import 'package:pull_to_refresh/pull_to_refresh.dart';
页面代码样例
class _MyHomePageState extends State<MyHomePage> { List<String> items = ["1","2","3","4","5","6","7","8"]; RefreshController _refreshController = RefreshController(initialRefresh: false); voID _onRefresh() async { // monitor network fetch await Future.delayed(Duration(milliseconds: 1000)); // if Failed,use refreshFailed() _refreshController.refreshCompleted(); } voID _onLoading() async { // monitor network fetch await Future.delayed(Duration(milliseconds: 1000)); // if Failed,use loadFailed(),if no data return,use LoadNodata() items.add((items.length + 1).toString()); if (mounted) setState(() {}); _refreshController.loadComplete(); } @overrIDe Widget build(BuildContext context) { return Scaffold( body: SmartRefresher( enablePullDown: true,enablePullUp: true,header: WaterDropheader(),footer: CustomFooter( builder: (BuildContext context,LoadStatus mode) { Widget body; if (mode == LoadStatus.IDle) { body = Text("pull up load"); } else if (mode == LoadStatus.loading) { body = CircularProgressIndicator(); } else if (mode == LoadStatus.Failed) { body = Text("Load Failed!Click retry!"); } else if (mode == LoadStatus.canLoading) { body = Text("release to load more"); } else { body = Text("No more Data"); } return Container( height: 55.0,child: Center(child: body),); },),controller: _refreshController,onRefresh: _onRefresh,onLoading: _onLoading,child: ListVIEw.builder( itemBuilder: (c,i) => Card(child: Center(child: Text(items[i]))),itemExtent: 100.0,itemCount: items.length,); }}完整源代码
https://gitee.com/cxyzy1/flutter_pulldown_refresh
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
总结以上是内存溢出为你收集整理的Flutter 实现下拉刷新上拉加载的示例代码全部内容,希望文章能够帮你解决Flutter 实现下拉刷新上拉加载的示例代码所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)