凡科商城app,宁波做seo推广企业,深圳建设材料价格网站,做线下活动的网站flutter开发实战-下拉刷新与上拉加载更多实现
在开发中经常遇到列表需要下拉刷新与上拉加载更多#xff0c;这里使用EasyRefresh#xff0c;版本是3.3.21
一、什么是EasyRefresh
EasyRefresh可以在Flutter应用程序上轻松实现下拉刷新和上拉加载。它几乎支持所有Flutter Sc…flutter开发实战-下拉刷新与上拉加载更多实现
在开发中经常遇到列表需要下拉刷新与上拉加载更多这里使用EasyRefresh版本是3.3.21
一、什么是EasyRefresh
EasyRefresh可以在Flutter应用程序上轻松实现下拉刷新和上拉加载。它几乎支持所有Flutter Scrollable小部件。它的功能与安卓的SmartRefreshLayout非常相似也吸收了许多第三方库的优势。EasyRefresh集成了各种风格的页眉和页脚但它没有任何限制您可以轻松自定义。使用Flutter强大的动画即使只是一个简单的控制也可以完成。EasyRefresh的目标是为Flutter创建一个强大、稳定、成熟的pull-to-refresh框架。
二、实现下拉刷新与上拉加载更多
在pubspec.yaml中引入EasyRefresh # 下拉刷新、上拉更多easy_refresh: ^3.3.21在使用EasyRefresh过程中需要用到EasyRefreshController来控制刷新结束。
/// Finish the refresh task and return the result./// [result] Result of task completion./// [force] Enforced, used to modify the result.void finishRefresh([IndicatorResult result IndicatorResult.success, bool force false]) {assert(controlFinishRefresh || force,Please set controlFinishRefresh to true, then use. If you want to modify the result, you can set force to true.);_state?._headerNotifier._finishTask(result);}/// Finish the load task and return the result./// [result] Result of task completion./// [force] Enforced, used to modify the result.void finishLoad([IndicatorResult result IndicatorResult.success, bool force false]) {assert(controlFinishLoad || force,Please set controlFinishLoad to true, then use. If you want to modify the result, you can set force to true.);_state?._footerNotifier._finishTask(result);}整体实现下拉刷新与上拉加载更多完整代码如下
import package:easy_refresh/easy_refresh.dart;
import package:flutter/material.dart;class RefreshPage extends StatefulWidget {const RefreshPage({super.key});overrideStateRefreshPage createState() _RefreshPageState();
}class _RefreshPageState extends StateRefreshPage {int _count 10;late EasyRefreshController _controller;overridevoid initState() {super.initState();_controller EasyRefreshController(controlFinishRefresh: true,controlFinishLoad: true,);}overridevoid dispose() {_controller.dispose();super.dispose();}overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text(EasyRefresh),),body: EasyRefresh(controller: _controller,header: const BezierCircleHeader(),footer: const ClassicFooter(),onRefresh: () async {await Future.delayed(const Duration(seconds: 4));if (!mounted) {return;}setState(() {_count 10;});_controller.finishRefresh();_controller.resetFooter();},onLoad: () async {await Future.delayed(const Duration(seconds: 4));if (!mounted) {return;}setState(() {_count 5;});_controller.finishLoad(_count 20 ? IndicatorResult.noMore : IndicatorResult.success);},child: ListView.builder(itemBuilder: (context, index) {return Card(child: Container(alignment: Alignment.center,height: 80,child: Text(${index 1}),),);},itemCount: _count,),),);}
}整体效果图如下 三、实现下拉刷新与上拉加载更多
flutter开发实战-下拉刷新与上拉加载更多实现。
https://blog.csdn.net/gloryFlow/article/details/133869961
学习记录每天不停进步。
