拉刷新页面内容,下拉加载更多功能
import 'package:flutter/material.dart';
import 'package:zetc_app/constants.dart';
/**
* 带上拉刷新和下拉加载的listView
*/
class RefreshListView extends StatefulWidget {
RefreshListView({
// 重新加载函数
this.reload,
// 列表数据
this.dataList,
// 页面数据
this.pageData,
// 生成每一行的样式函数
this.itemRow,
// 内容高度
this.height,
// 背景颜色
this.bgColor,
// 翻页参数
this.page,
// 是否加载完全部数据
this.isLoadedAll,
});
final reload;
final dataList;
final pageData;
final itemRow;
final double height;
final int page;
final bool isLoadedAll;
final Color bgColor;
@override
_RefreshListViewState createState() => _RefreshListViewState();
}
class _RefreshListViewState extends State<RefreshListView> {
// 滚动控制器
ScrollController _scrollController = new ScrollController();
// 是否正在加载中
bool isLoading = false;
@override
void initState() {
super.initState();
// 添加事件
_scrollController.addListener(() {
// 当前位置信息
var position = _scrollController.position;
// 小于50px时,触发上拉加载;
if (position.maxScrollExtent - position.pixels < 50) {
if (!widget.isLoadedAll && !isLoading) {
isLoading = true;
// 加载更多方法
widget.reload(widget.page,(){
isLoading = false;
});
}
}
});
}
@override
void dispose() {
_scrollController?.dispose();
super.dispose();
}
/**
* 上拉刷新方法
*/
Future<void> _onRefresh() async {
await widget.reload(1,(){});
}
Widget _getRow(BuildContext context, int index) {
if (index < widget.dataList.length) {
return widget.itemRow(context, index, widget.dataList);
}
return _getMoreWidget();
}
Widget _getMoreWidget() {
if (widget.isLoadedAll) {
return Center(
child: Padding(
padding:
EdgeInsets.symmetric(vertical: Constants().h20, horizontal: 0),
child: Text(
widget.dataList.length>0?'已加载完全部数据':'暂无数据!',
style: TextStyle(fontSize: Constants().sp28),
),
),
);
} else {
return Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
SizedBox(
width: Constants().w40,
height: Constants().w40,
child: CircularProgressIndicator(
strokeWidth: Constants().w2,
valueColor: AlwaysStoppedAnimation<Color>(
Constants().defaultBtnBgColor),
),
),
Padding(
padding: EdgeInsets.symmetric(
vertical: Constants().h10, horizontal: Constants().w30),
child: Text(
'加载中...',
style: TextStyle(fontSize: Constants().sp28),
),
),
],
),
);
}
}
@override
Widget build(BuildContext context) {
return Container(
height: widget.height ?? double.infinity,
color: widget.bgColor ?? Colors.white,
child: RefreshIndicator(
color: Constants().defaultFontColor,
backgroundColor: Colors.white,
child: widget.dataList.length == 0
? _getMoreWidget()
: ListView.builder(
controller: _scrollController,
itemCount: widget.dataList.length == 0
? 0
: widget.dataList.length + 1,
itemBuilder: (context, index) {
return _getRow(context, index);
},
),
onRefresh: _onRefresh));
}
}
使用方式:
// 引入上面的文件类
import 'package:demo_app/components/refrest_list_view.dart';
// 省略其他不相关代码...
// 定义参数
List dataList = [];
int page = 1;
int pageSize = 6;
bool isLoadedAll = false;
bool noData = false;
_getData(int currentPageIndex,callback) {
ApiRequestUtil.getCoinOutLog(currentPageIndex, pageSize, {
"context": context,
"success": (res) {
callback();
if (mounted) {
setState(() {
if(currentPageIndex == 1){
dataList = res["data"]["data"];
}else{
dataList.addAll(res["data"]["data"]);
}
var currentPage = int.parse(res["data"]["current_page"].toString());
var lastPage = int.parse(res["data"]["last_page"].toString());
if (currentPage >= lastPage) {
isLoadedAll = true;
} else {
isLoadedAll = false;
page = currentPageIndex + 1;
}
});
}
},
"fail": () {
setState(() {
noData = true;
});
}
});
}
@override
void initState() {
// TODO: implement initState
super.initState();
_getData(1,(){});
}
// 无数据的情况下的显示方式
Widget _noData() {
return Center(
child: Text("暂无记录!", style: TextStyle(fontSize: Constants().sp28)),
);
}
// 每一行生成的函数
Widget _itemRow(BuildContext context, int index, List dataList) {
return GestureDetector(
behavior: HitTestBehavior.translucent,
onTap: () {
// 跳转到公告详情页面
},
child: Container(
// 行的内容自定义
)
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: noData
? _noData()
: RefreshListView(
reload: _getData,
isLoadedAll: isLoadedAll,
page: page,
dataList: dataList,
itemRow: _itemRow,
)
);
}
}
欢迎加群讨论更多flutter相关问题(7天有效)如果失效,可加个人微信拉群