Flutter easyrefresh示例 上拉加载+下拉刷新
官方示例,简单改了下,实现功能为主。
代码如下:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart'; class BasicPage extends StatefulWidget {
@override
_BasicPageState createState() => _BasicPageState();
} class _BasicPageState extends State<BasicPage> {
List<String> addStr = ["", "", "", "", "", "", "", "", "", ""];
List<String> str = ["", "", "", "", "", "", "", "", "", ""];
GlobalKey<EasyRefreshState> _easyRefreshKey = GlobalKey<EasyRefreshState>(); @override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("EasyRefresh"),
),
body: Center(
child: new EasyRefresh(
key: _easyRefreshKey, child: new ListView.builder(
//ListView的Item
itemCount: str.length,
itemBuilder: (BuildContext context, int index) {
return new Container(
height: 70.0,
child: Card(
child: new Center(
child: new Text(
str[index],
style: new TextStyle(fontSize: 18.0),
),
),
));
}),
onRefresh: () async {
await new Future.delayed(const Duration(seconds: ), () {
setState(() {
str.clear();
str.addAll(addStr);
});
});
},
loadMore: () async {
await new Future.delayed(const Duration(seconds: ), () {
if (str.length < ) {
setState(() {
str.addAll(addStr);
});
}
});
},
)), );
}
}
特殊效果+底部按钮,代码如下:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_easyrefresh/easy_refresh.dart';
import 'package:flutter_easyrefresh/bezier_circle_header.dart';//如果要使用炫酷的样式需要引入,不同的样式引入不同的文件,详见官方api
import 'package:flutter_easyrefresh/bezier_bounce_footer.dart';//如果要使用炫酷的样式需要引入,不同的样式引入不同的文件,详见官方api class BasicPage extends StatefulWidget {
@override
_BasicPageState createState() => _BasicPageState();
} class _BasicPageState extends State<BasicPage> {
List<String> addStr = ["", "", "", "", "", "", "", "", "", ""];
List<String> str = ["", "", "", "", "", "", "", "", "", ""];
GlobalKey<EasyRefreshState> _easyRefreshKey = new GlobalKey<EasyRefreshState>();
GlobalKey<RefreshHeaderState> _headerKey = new GlobalKey<RefreshHeaderState>();
GlobalKey<RefreshFooterState> _footerKey = new GlobalKey<RefreshFooterState>(); @override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("EasyRefresh"),
),
body: Center(
child: new EasyRefresh(
key: _easyRefreshKey,
refreshHeader: BezierCircleHeader(
key: _headerKey,
color: Theme.of(context).scaffoldBackgroundColor,
),
refreshFooter: BezierBounceFooter(
key: _footerKey,
color: Theme.of(context).scaffoldBackgroundColor,
),
child: new ListView.builder(
//ListView的Item
itemCount: str.length,
itemBuilder: (BuildContext context, int index) {
return new Container(
height: 70.0,
child: Card(
child: new Center(
child: new Text(
str[index],
style: new TextStyle(fontSize: 18.0),
),
),
));
}),
onRefresh: () async {
await new Future.delayed(const Duration(seconds: ), () {
setState(() {
str.clear();
str.addAll(addStr);
});
});
},
loadMore: () async {
await new Future.delayed(const Duration(seconds: ), () {
if (str.length < ) {
setState(() {
str.addAll(addStr);
});
}
});
},
)),
persistentFooterButtons: <Widget>[
FlatButton(
onPressed: () {
_easyRefreshKey.currentState.callRefresh();
},
child: Text("refresh", style: TextStyle(color: Colors.black))),
FlatButton(
onPressed: () {
_easyRefreshKey.currentState.callLoadMore();
},
child: Text("loadMore", style: TextStyle(color: Colors.black)))
],
);
}
}
效果图:

Flutter easyrefresh示例 上拉加载+下拉刷新的更多相关文章
- Vue mint ui用在消息页面上拉加载下拉刷新loadmore 标记
之前总结过一个页面存在多个下拉加载的处理方式,今天再来说一下在消息页面的上拉加载和下拉刷新,基本上每个app都会有消息页面,会遇到这个需求 需求:每次加载十条数据,上拉加载下拉刷新,并且没有点击查看过 ...
- 上拉加载下拉刷新控件WaterRefreshLoadMoreView
上拉加载下拉刷新控件WaterRefreshLoadMoreView 效果: 源码: // // SRSlimeView // @author SR // Modified by JunHan on ...
- RecyclerView 上拉加载下拉刷新
RecyclerView 上拉加载下拉刷新 <android.support.v4.widget.SwipeRefreshLayout android:id="@+id/teach_s ...
- APICloud上啦加载下拉刷新模块
apicloud有自带的上啦加载下拉刷新,当让也可以用第三方或者在模块库里面找一个使用 一.下拉刷新,一下代码写在 apiready = function (){} 里面 apiready = fun ...
- 微信小程序上拉加载下拉刷新
微信小程序实现上拉加载下拉刷新 使用小程序默认提供方法. (1). 在xxx.json 中开启下拉刷新,需要设置backgroundColor,或者是backgroundTextStyle ,因为加载 ...
- mui scroll和上拉加载/下拉刷新
mui中 scroll和上拉加载/下拉刷新同时存在会出现两个滚动条 把/* */ /* //mui页面鼠标拖动代码: mui('.mui-scroll-wrapper').scroll({ dec ...
- Flutter上拉加载下拉刷新---flutter_easyrefresh
前言 Flutter默认不支持上拉加载,下拉刷新也仅仅支持Material的一种样式.Android开发使用过SmartRefreshLayout的小伙伴都知道这是一个强大的刷新UI库,集成了很多出色 ...
- 微信小程序 - 上拉加载下拉刷新
点击下载示例:小程序 - 上拉刷新下拉加载
- flutter 下拉加载+下拉加载
功能: 1.下拉加载 2.上拉加载 3.显示加载图标 4.更新列表数据,隐藏加载图标 flutter库: flutter_spinkit: ^3.1.0 加载图标 其他:加载列表需要列表,基于上一节的 ...
- SwipeRefreshLayout实现上拉加载下拉刷新
package com.example.swiperefreshlayoutdemo; import java.util.ArrayList;import java.util.HashMap; imp ...
随机推荐
- MySQL数据库中常用的引擎有几种?有什么区别?
1.常用的3种 2.InnoDB Myisam Memory 3.InnoDB跟Myisam的默认索引是B+tree,Memory的默认索引是hash 区别: 1.InnoDB支持事务,支持外键,支 ...
- java线程中yield(),sleep(),wait()区别详解
1.sleep() 使当前线程(即调用该方法的线程)暂停执行一段时间,让其他线程有机会继续执行,但它并不释放对象锁.也就是说如果有synchronized同步快,其他线程仍然不能访问共享数据.注意该方 ...
- 010_IAR安装
链接:https://pan.baidu.com/s/14qZh1Gxl32dD2TWdjEYP7Q提取码:yj65 复制这段内容后打开百度网盘手机App,操作更方便哦 里面有安装说明 (一)编辑界面 ...
- Time 时间格式处理方法
一般时间调用都会精确到年 月 日 时 分 秒 怎么调用时去掉时 分 秒呢 用以下格式来处理 //时间格式处理 var time = new Date(data.FTime); var ...
- SD六校联考二轮
数据差评 D1T1 string 直接模拟 每次 string_u = const_string + string_v 理论得分 30 实际可得 100 D2T1 n^2 理论得分 30 实际可得 1 ...
- EAST结构分析+pytorch源码实现
目录 EAST结构分析+pytorch源码实现 @ 一. U-Net的前车之鉴 1.1 FCN网络结构 1.2 U-NET网络 1.3 CTPN网络 二. EAST结构分析 2.1 结构简述 2.2 ...
- LOJ2541. 「PKUWC2018」猎人杀 [概率,分治NTT]
传送门 思路 好一个神仙题qwq 首先,发现由于一个人死之后分母会变,非常麻烦,考虑用某种方法定住分母. 我们稍微改一改游戏规则:一个人被打死时只打个标记,并不移走,也就是说可以被打多次但只算一次.容 ...
- weui-wxss框架实现博远企信小程序
- Java 方法与数组
方法 什么是方法? 方法定义:方法(Method),函数(function),其实就指一个特定的功能操作,程序中完成独立功能,可重复使用的一段代码的集合. 方法的定义 方法定义格式: [修饰符] 返回 ...
- 计算机基础——Java笔记一
电子管-晶体管 摩尔定律 18个月变一次 贝尔实验室 C语言是基础.芯片领域软件领域 机器语言 ——汇编语言——高级语言 (面向过程,面向对象) 基本的逻辑怎么用代码实 ...