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 ...
随机推荐
- 信息: TLD skipped. URI: http://java.sun.com/jstl/* is already defined解决方法
整合Spring MVC由于用到jstl,所以假如jstl便签用的jar包,启动tomcat时控制台出现了如下的输出: standard.jar与jstl.jar一起使用,但是jstl 1.2版本的就 ...
- sql注入-原理&防御
SQL注入是指web应用程序对用户输入数据的合法性没有判断或过滤不严,攻击者可以在web应用程序中事先定义好的查询语句的结尾上添加额外的SQL语句,在管理员不知情的情况下实现非法操作,以此来实现欺骗数 ...
- Java8 ,LocalDate,LocalDateTime处理日期和时间工具类,
Java8 ,LocalDate,LocalDateTime处理日期和时间工具类 1.获取今天的日期 2.在Java 8 中获取年.月.日信息 3.在Java 8 中处理特定日期 4.在Java 8 ...
- java校验导入的模板
/** * 验证导入模板的正确性 InputStream inputStream = file.getInputStream(); */ @SuppressWarnings("depreca ...
- 利用PWM脉宽调制实现呼吸灯
1.设计目标 完成一个呼吸灯,从亮到灭的时间为2秒,从灭到亮的时间为2秒,以此不断往复. 2.设计步骤 2.1设计分析 利用PWM(脉冲宽度调制)实现led灯亮度的变化,只需要改变占空比就可以实现,具 ...
- 2020第十一届蓝桥杯第二场JavaB组
第一题:门牌制作(624) 题目大意: 判断1到2020里面共有多少个'2': 解析: 本题简而言之就是找'2'这一个数 第一种方法:遍历将其转换为字符然后再遍历寻找 第二种方法:直接用数值的方法进行 ...
- springsecurity教程一
可以看这个人的springsecurity省的自己写了 1.springsecurity学习目标 2.1 springsecurity简介 2.2 springsecurity快速入门demo 1): ...
- 力扣1423. 可获得的最大点数-C语言
题目 题目链接 几张卡牌 排成一行,每张卡牌都有一个对应的点数.点数由整数数组 cardPoints 给出. 每次行动,你可以从行的开头或者末尾拿一张卡牌,最终你必须正好拿 k 张卡牌. 你的点数就是 ...
- Educational Codeforces Round 88 (Rated for Div. 2) A. Berland Poker(数学)
题目链接:https://codeforces.com/contest/1359/problem/A 题意 $n$ 张牌可以刚好被平分给 $k$ 个人,其中有 $m$ 张 joker,当一个人手中的 ...
- hdu5233 Gunner II
Problem Description Long long ago, there was a gunner whose name is Jack. He likes to go hunting ver ...