flutter 刷新组件

Posted pp-pping

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了flutter 刷新组件相关的知识,希望对你有一定的参考价值。

代码:

import ‘package:flutter/material.dart‘;
import ‘package:flutter_project/service/service_method.dart‘;
import ‘dart:convert‘;
import ‘swiper_demo.dart‘;
import ‘top_navigator.dart‘;
import ‘adbanner.dart‘;
import ‘callPhone.dart‘;
import ‘recommand.dart‘;
import ‘floor.dart‘;
import ‘hot_goods.dart‘;
import ‘package:flutter_easyrefresh/easy_refresh.dart‘;
class HomePage extends StatefulWidget {
HomePage({Key key}) : super(key: key);

@override
_HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin {//with 混入 AutomaticKeepAliveClientMixin保活 1.需要这个类继承 StatefulWidget 2.重写wantKeepAlive 并置为true 3.在此文件的父页面使用IndexedStack
int pageIndex = 1; //页码
GlobalKey<HotGoodsState> hotGoodsKey = new GlobalKey<HotGoodsState>();//不能使用_xxx声明的类 那是私有
GlobalKey<RefreshFooterState> _footerStateKey = new GlobalKey<RefreshFooterState>();
@override
bool get wantKeepAlive => true;//保持页面效果 就是返回当前页面不重新加载
@override
void initState() {
super.initState();
print(‘11111‘);//不保活 就会重新加载 就会调用这个方法
}

@override
Widget build(BuildContext context) {
 
//设置key
return Scaffold(
appBar: AppBar(title: Text(‘百姓生活‘)),
body: Container(
child: FutureBuilder(//网络数据返回能很好的渲染控件
future: getHomePageContent(),//网络返回的数据
 
 
builder: (context,snapshot){
if (snapshot.hasData) {//snapshot 相当于返回的数据
var data = json.decode(snapshot.data.toString());

List<Map> swiper = (data[‘data‘][‘slides‘] as List).cast();

List<Map> navlist = (data[‘data‘][‘category‘] as List).cast();

String adPic = data[‘data‘][‘advertesPicture‘][‘PICTURE_ADDRESS‘];

String phoneBgImage = data[‘data‘][‘shopInfo‘][‘leaderImage‘];
 
String phoneNum = data[‘data‘][‘shopInfo‘][‘leaderPhone‘];

List<Map> recommendList = (data[‘data‘][‘recommend‘] as List).cast();

String floorTitle1 = data[‘data‘][‘floor1Pic‘][‘PICTURE_ADDRESS‘];
String floorTitle2 = data[‘data‘][‘floor2Pic‘][‘PICTURE_ADDRESS‘];
String floorTitle3 = data[‘data‘][‘floor3Pic‘][‘PICTURE_ADDRESS‘];

List<Map> floorContent1 = (data[‘data‘][‘floor1‘] as List).cast();
List<Map> floorContent2 = (data[‘data‘][‘floor2‘] as List).cast();
List<Map> floorContent3 = (data[‘data‘][‘floor3‘] as List).cast();
return EasyRefresh(
child: ListView(
children: <Widget>[//各个组件
SwiperDiy(swiperDataList: swiper),//轮播
TopNavigator(navigatorList: navlist),//导航引导
AdBanner(adPicture: adPic),//广告
CallPhone(backgroundImage: phoneBgImage,shopPhone:phoneNum,),//打电话
Recomend(recommendList: recommendList,),//推荐
FloorTitle(picture_address: floorTitle1,),//楼层标题
FloorContent(floorGoodsList:floorContent1),//楼层内容
FloorTitle(picture_address: floorTitle2,),//楼层标题
FloorContent(floorGoodsList:floorContent2),//楼层内容
FloorTitle(picture_address: floorTitle3,),//楼层标题
FloorContent(floorGoodsList:floorContent3),//楼层内容
 
HotGoods(key: hotGoodsKey,),//热门商品
],
),
loadMore: ()async{
pageIndex++;
hotGoodsKey.currentState.getHotGoods(pageIndex);
},
refreshFooter: ClassicsFooter(//刷新尾样式
bgColor: Colors.white,
textColor: Colors.pink,
moreInfoColor: Colors.pink,//加载中的颜色
showMore: true,
noMoreText: ‘‘,//没有信息 设置为空
moreInfo: ‘加载中‘,
loadReadyText: ‘上拉加载‘,
loadingText: ‘加载中‘,
loadText: ‘下拉‘,
key: _footerStateKey,
),
);
}else{
return Center(
child: Text(‘加载错误‘),
);
}
},
),
),
);
}
}
总结:

//刷新组件

使用外部类的方法 需要把这个类的方法 类型 定义成public 

HotGoodsState createState() => HotGoodsState();//想要外面调用 得使用不带_

在需要调用的类中 定义 globalKey

 GlobalKey<HotGoodsState>  hotGoodsKey = new GlobalKey<HotGoodsState>();//不能使用_xxx声明的类 那是私有

HotGoods(key: hotGoodsKey,),//热门商品 需要定义的类中引入key

hotGoodsKey.currentState.getHotGoods(pageIndex);//方法的调用

以上是关于flutter 刷新组件的主要内容,如果未能解决你的问题,请参考以下文章

Flutter ValueNotifier 倒计时 局部刷新组件 在StatelessWidget 中刷新倒计时

Flutter 实现局部刷新 StreamBuilder 实例详解

Flutter 实现局部刷新 StreamBuilder 实例详解

Flutter学习组件通信(父子兄弟)

Flutter:手把手教你使用滚动型列表组件:ListView

Flutter 开发从 0 到 1ListView 下拉加载和加载更多