I need to implement the pull to refresh action, on a future builder using refresh indicator widget. First of all, i know there are multiple threads on this topic. But I still couldn't. Here are my codes on the subject:
final QuerySnapshot<Map<String, dynamic>> querySnapshot =
snapshot.data as QuerySnapshot<Map<String, dynamic>>;
return ListView(
physics: const BouncingScrollPhysics(),
children: <Widget>[
Container(
margin: const EdgeInsets.only(top: 28.8, bottom: 16.8),
height: 714.8,
child: FutureBuilder<List<FirabaseWeatherModel>>(
future: chnageList(querySnapshot),
builder: (BuildContext context,
AsyncSnapshot<dynamic> snapshot) {
if (snapshot.hasData) {
ListView.builder(
itemCount: firabseModelList.length,
padding:
const EdgeInsets.only(left: 28.8, right: 12),
scrollDirection: Axis.vertical,
physics: const BouncingScrollPhysics(),
itemBuilder: (context, index) {
return Container(
height: 214.8,
width: 188.4,
margin: const EdgeInsets.only(
right: 16.8, bottom: 50),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(9.6),
image: DecorationImage(
fit: BoxFit.cover,
image: CachedNetworkImageProvider(
querySnapshot.docs[index]
.data()['image'],
maxHeight: 200,
maxWidth: 200),
),),
child: Stack(
children: <Widget>[
GestureDetector(
onTap: () => gotoPage(querySnapshot
.docs[index]
.data()['title'])),
],),);},);
} else if (snapshot.connectionState ==
ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);}
return ListView.builder(
itemCount: firabseModelList.length,
padding: const EdgeInsets.only(left: 28.8, right: 12),
scrollDirection: Axis.vertical,
physics: const BouncingScrollPhysics(),
itemBuilder: (context, index) {
return Container(
height: 214.8,
width: 188.4,
margin: const EdgeInsets.only(
right: 16.8, bottom: 50),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(9.6),
image: DecorationImage(
fit: BoxFit.cover,
image: CachedNetworkImageProvider(
querySnapshot.docs[index].data()['image'],
maxHeight: 200,
maxWidth: 200),
),),
child: Stack(
children: <Widget>[
GestureDetector(
onTap: () => gotoPage(querySnapshot
.docs[index]
.data()['title'])),
Positioned(
child: ClipRRect(
child: Container(
height: 80,
alignment: Alignment.centerLeft,
child: Column(
children: [
Align(
child: Container(
alignment: Alignment.topCenter,
child: Text(
querySnapshot.docs[index]
.data()['tr'],
style: const TextStyle(
fontSize: 15,
),),),),
Row(
children: <Widget>[
Expanded(
child: getImage(
querySnapshot.docs[index]
.data()['zposition1']
.toString(),
150),
),],),],),),),),],),);},);}),),],);
I have uploaded all the code in case you want to try it yourself using all the codes. Where should i use these refresh indicator codes:
RefreshIndicator(
onRefresh: () {},),
CodePudding user response:
// add key
GlobalKey _key = GlobalKey();
///then assign the previous key to the top widget
return RefreshIndicator(
onRefresh: _refresh,
child: Container(
key: _key,
child: ListView(
physics: AlwaysScrollableScrollPhysics(),
children: [
/// your code here
],
),
),
);
/// then refresh func , as you should update the key
Future<void> _refresh() async {
if (mounted) {
_key = GlobalKey();
setState(() {});
}
Future.value(null);
}