Flutter上拉加载下拉刷新---flutter_easyrefresh

前言

Flutter默认不支持上拉加载，下拉刷新也仅仅支持Material的一种样式。Android开发使用过SmartRefreshLayout的小伙伴都知道这是一个强大的刷新UI库，集成了不少出色的动画效果，而且对自定义支持很是好。接下来给你们介绍的就是，Flutter版本的刷新UI库---flutter_easyrefresh，在功能方面已经很接近Android的SmartRefreshLayout。

Github地址：flutter_easyrefresh

介绍

正如名字同样，EasyRefresh很容易就能在Flutter应用上实现下拉刷新以及上拉加载操做，它支持几乎全部的Flutter控件，但前提是须要包裹成ScrollView。它的功能与Android的SmartRefreshLayout很类似，一样也吸收了不少三方库的优势。EasyRefresh中集成了多种风格的Header和Footer，可是它并无局限性，你能够很轻松的自定义。使用Flutter强大的动画，甚至随便一个简单的控件也能够完成。EasyRefresh的目标是为Flutter打造一个强大，稳定，成熟的下拉刷新框架。

特色功能:

• 支持Andorid(光晕)，ios(越界回弹)效果
• 支持任意的ScrollView控件，若是不是进行简单封装便可(因此理论是全部控件)
• 支持自定义而且已经集成了不少炫酷的 Header 和 Footer
• 支持下拉刷新、上拉加载(可自动)
• 支持 Header 和 Footer 列表嵌入以及视图浮动两种形式

传送门

• 属性文档
• 更新日志
• 自定义Header和Footer

Demo

下载 APK-Demo

简单用例

1.在 pubspec.yaml 中添加依赖

//pub方式
dependencies:
  flutter_easyrefresh: last_version

//导入方式
dependencies:
  flutter_easyrefresh:
    path: 项目路径

2.在布局文件中添加 EasyreFresh

import 'package:flutter_easyrefresh/easy_refresh.dart';
....
  GlobalKey<EasyRefreshState> _easyRefreshKey = new GlobalKey<EasyRefreshState>();
....
  new EasyRefresh(
    key: _easyRefreshKey,
    child: ScrollView(),
    onRefresh: () async{
      ....
    },
    loadMore: () async {
      ....
    },
  )

3.触发刷新和加载动做

// 若是不须要能够不用设置EasyRefresh的key
  _easyRefreshKey.currentState.callRefresh();
  _easyRefreshKey.currentState.callLoadMore();

使用指定的 Header 和 Footer

import 'package:flutter_easyrefresh/easy_refresh.dart';
....
  GlobalKey<RefreshHeaderState> _headerKey = new GlobalKey<RefreshHeaderState>();
  GlobalKey<RefreshFooterState> _footerKey = new GlobalKey<RefreshFooterState>();
....
  // 由于EasyRefresh会对Header和Footer进行更新，为了与用户保持统一的操做状态，必须设置key
  // 不一样的Header和Footer可能有不一样的参数设置
  new EasyRefresh(
    refreshHeader: MaterialHeader(
        key: _headerKey,
    ),
    refreshFooter: MaterialFooter(
        key: _footerKey,
    ),
    child: ScrollView(),
    ....
  )

QQ讨论群 - 554981921

进群须知

这个群不单单是解决EasyreFresh的问题，任何Flutter相关的问题均可以进行讨论。正如它的名字同样，有问必答，只要群主有时间，都会帮你们一块儿解决问题。