Flutter: 下拉刷新,上拉加载更多
import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';
void main() => runApp(Myapp());
class Myapp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(home: MyHome());
}
}
class MyHome extends StatefulWidget {
@override
_MyHomeState createState() => _MyHomeState();
}
class _MyHomeState extends State<MyHome> {
final _suggestions = <WordPair>[];
bool _loading = true;
ScrollController _strollCtrl = ScrollController();
Future<void> _getData() async {
await Future.delayed(Duration(seconds: 1));
setState(() {
_suggestions.addAll(generateWordPairs().take(15));
_loading = false;
});
}
@override
void initState() {
_getData();
_strollCtrl.addListener(() {
if (_strollCtrl.position.pixels == _strollCtrl.position.maxScrollExtent) {
if (!_loading) {
setState(() {
_loading = true;
});
}
_getData();
}
});
super.initState();
}
@override
void dispose() {
_strollCtrl.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('ListView'),
),
body: Stack(
children: <Widget>[
_loading
? Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
RefreshProgressIndicator(
semanticsLabel: 'loading more..',
semanticsValue: 'loading more..',
),
Text(
'加载中...',
style: Theme.of(context).textTheme.title,
),
],
),
)
: Container(),
// 下拉加载更多组件
RefreshIndicator(
onRefresh: () async {
_suggestions.clear();
return _getData();
},
child: ListView.builder(
physics: const AlwaysScrollableScrollPhysics(), // 确保滚动视图始终可滚动
controller: _strollCtrl,
itemCount: _suggestions.length,
itemBuilder: (context, i) {
return ListTile(
leading: Text('${(i + 1).toString()}'),
title: Text('${_suggestions[i].asPascalCase}'),
trailing: Icon(Icons.event),
);
},
),
),
],
),
);
}
}
Flutter: 下拉刷新,上拉加载更多的更多相关文章
- SwipeRefreshLayout实现下拉刷新上滑加载
1. 效果图 2.RefreshLayout.java package myapplication.com.myapplication; import android.content.Context; ...
- Android 下拉刷新上啦加载SmartRefreshLayout + RecyclerView
在弄android刷新的时候,可算是耗费了一番功夫,最后发觉有现成的控件,并且非常好用,这里记录一下. 原文是 https://blog.csdn.net/huangxin112/article/de ...
- juery下拉刷新,div加载更多元素并添加点击事件(二)
buffer.append("<div class='col-xs-3 "+companyId+"' style='padding-left: 10px; padd ...
- 移动端下拉刷新上拉加载-mescroll.js插件
最近无意间看到有这么一个上拉刷新下拉加载的插件 -- mescroll.js,个人感觉挺好用的,官网地址是:http://www.mescroll.com 然后我就看了一下文档,简单的写了一个小dem ...
- Android如何定制一个下拉刷新,上滑加载更多的容器
前言 下拉刷新和上滑加载更多,是一种比较常用的列表数据交互方式. android提供了原生的下拉刷新容器 SwipeRefreshLayout,可惜样式不能定制. 于是打算自己实现一个专用的.但是下拉 ...
- Android 自定义 ListView 上下拉动“刷新最新”和“加载更多”歌曲列表
本文内容 环境 测试数据 项目结构 演示 参考资料 本文演示,上拉刷新最新的歌曲列表,和下拉加载更多的歌曲列表.所谓"刷新最新"和"加载更多"是指日期.演示代码 ...
- 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载
title: 带你实现开发者头条APP(五)--RecyclerView下拉刷新上拉加载 tags: -RecyclerView,下拉刷新,上拉加载更多 grammar_cjkRuby: true - ...
- ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多
ListView实现Item上下拖动交换位置 并且实现下拉刷新 上拉加载更多 package com.example.ListViewDragItem; import android.app.Ac ...
- [ionic开源项目教程] - 第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll
第7讲 实现下拉刷新上拉加载ion-refresher和ion-infinite-scroll 1.将tab1.html的代码改为如下: <ion-content> <ion-ref ...
- JS+CSS实现的下拉刷新/上拉加载插件
闲来无事,写了一个当下比较常见的下拉刷新/上拉加载的jquery插件,代码记录在这里,有兴趣将代码写成插件与npm包可以留言. 体验地址:http://owenliang.github.io/pull ...
随机推荐
- HDU1814和平委员会
题目大意: 有n对的人,编号从1-2*n,m对的人之间互相不喜欢,每对人中必徐选1个人加入和平委员会,求字典序最小的解 -------------------------------- 2-SAT问题 ...
- 洛谷P3850 书架
题目描述 Knuth先生家里有个精致的书架,书架上有N本书,如今他想学到更多的知识,于是又买来了M本不同的新书.现在他要把新买的书依次插入到书架中,他已经把每本书要插入的位置标记好了,并且相应的将它们 ...
- loj10173
炮兵阵地 司令部的将军们打算在 N×M 的网格地图上部署他们的炮兵部队.一个 N×M的地图由 N 行 M 列组成,地图的每一格可能是山地(用 H 表示),也可能是平原(用 P表示),如下图.在每一格平 ...
- Zookeeper语法
ZooKeeper 是一个典型的分布式数据一致性解决方案,分布式应用程序可以基于 ZooKeeper 实现诸如数据发布/订阅.负载均衡.命名服务.分布式协调/通知.集群管理.Master 选举.分布式 ...
- python基础三---- time模块,函数的定义和调用
此处重点说明一下: 注意: 1.用例之间不要存在依赖关系,每个用例都可以单独运行 2.用例不要互相调用,需要调用的公共方法可以写成方法去调用 1.等待 (在脚本运行的时候,有些线程之间需要间隔时间,可 ...
- python 基础学习4 字典和循环语句
学了这么多天的基础,好着急的想什么时候可以开始写个小程序,今天还是静下心来把字典和循环语句学习了 关于字典,主要是了解了字典的创建,和映射,以及一些基本的运算法,运算法不一一列出,运算法在用到的时候会 ...
- 2019牛客暑期多校训练营(第七场)H.Pair(数位dp)
题意:给你三个数A,B,C 现在要你找到满足 A and B >C 或者 A 异或 B < C 的对数. 思路:我们可以走对立面 把既满足 A and B <= C 也满足 A 异 ...
- 回溯法、子集树、排列树、满m叉树
显示图: 明确给出了图中的各顶点及边 隐式图: 仅给出初始节点.目标节点及产生子节点的条件(一般有问题提议隐含给出)的情况下,构造一个图. 回溯法: 从初始状态出发,在隐式图中以深度优先的方式搜索问题 ...
- Detect the Virus ZOJ - 3430 AC自动机
One day, Nobita found that his computer is extremely slow. After several hours' work, he finally fou ...
- C#之Dispose
前言 谈到Dispose,首先需要理解C#的资源 资源类型 托管资源:由CLR创建和释放 非托管资源:资源的创建和释放不由CLR管理.比如IO.网络连接.数据库连接等等.需要开发人员手动释放. 如何释 ...