flutter刷新页面_Flutter 页面下拉刷新和上拉加载

flutter_easyrefresh

正如名字一样，EasyRefresh很容易就能在Flutter应用上实现下拉刷新以及上拉加载操作，它支持几乎所有的Flutter控件。它的功能与Android的SmartRefreshLayout很相似，同样也吸取了很多三方库的优点。EasyRefresh中集成了多种风格的Header和Footer，但是它并没有局限性，你可以很轻松的自定义。使用Flutter强大的动画，甚至随便一个简单的控件也可以完成。EasyRefresh的目标是为Flutter打造一个强大，稳定，成熟的下拉刷新框架。github地址：https://github.com/xuelongqy/flutter_easyrefresh

特点功能:

支持Andorid(光晕)，ios(越界回弹)效果

支持绝大多数Widget

支持自定义并且已经集成了很多炫酷的 Header 和 Footer

支持下拉刷新、上拉加载(可自动)

支持 Header 和 Footer 列表嵌入以及视图浮动两种形式

支持列表事件监听，制作任何样子的 Header 和 Footer，并且能够放在任何位置

支持首次刷新，并自定义视图

支持自定义列表空视图

这次就用easy_refresh插件，实现下拉刷新以及上拉加载功能。

1.在 pubspec.yaml 中添加依赖：

flutter_easyrefresh: ^1.2.7

然后页面引入：

import 'package:flutter_easyrefresh/easy_refresh.dart';

2.在布局文件中添加 EasyreFresh

//方式一

EasyRefresh(

child: ScrollView(),

onRefresh: ()async{

....

},

onLoad: ()async{

....

},

)//方式二

EasyRefresh.custom(

slivers:[],

onRefresh: ()async{

....

},

onLoad: ()async{

....

},

)//方式三

EasyRefresh.builder(

builder: (context, physics, header, footer) {returnCustomScrollView(

physics: physics,

slivers:[

...

header,

...

footer,

],

);

}

onRefresh: ()async{

....

},

onLoad: ()async{

....

},

)

3.触发刷新和加载动作

EasyRefreshController _controller =EasyRefreshController();

....

EasyRefresh(

controller: _controller,

....

);

....

_controller.callRefresh();

_controller.callLoad();

4.控制加载和刷新完成

EasyRefreshController _controller =EasyRefreshController();

....

EasyRefresh(

enableControlFinishRefresh:true,

enableControlFinishLoad:true,

....

);

....

_controller.finishRefresh(success:true);

_controller.callLoad(success：true, noMore: false);

制作上拉加载效果示例