Home > Mobile >  how to implement refresh indicator in flutter
how to implement refresh indicator in flutter

Time:05-28

''' I wanted to implement refresh indicator to reload data's from Api(Json). below code runs well but pull down to refresh is not working. i tried to get the data's initially using initState and then view the data's using future builder. how can i achieve the refresh indicator to reload data's. what is missing from my code?

import 'package:flutter/material.dart';
import '../networkhelper/property.dart';
import '../widgets/recommended.dart';
import '../model/property.dart';
import '../shimmer/recommended.dart';
import '../widgets/home_top.dart';

class Home extends StatefulWidget {
  const Home({Key? key}) : super(key: key);

  @override
  State<Home> createState() => _HomeState();
}
class _HomeState extends State<Home> {
  late Future<List<PropertyModel>> _propertyData;
  @override
  void initState() {
    _propertyData = PropertyApi.getProperty();
    super.initState();
  }
  Future<void> _refreshData() async {
    setState(() {
      _propertyData = PropertyApi.getProperty();
    });
    await _propertyData;
  }
  @override
  Widget build(BuildContext context) {
    Size _screenSize = MediaQuery.of(context).size;
    return Scaffold(
      backgroundColor: Colors.blue,
      body: RefreshIndicator(
        onRefresh: () => _refreshData(),
        child: ListView(children: [
          HomeTopView(),
          Container(
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(8),
                topRight: Radius.circular(8),
              ),
            ),
            child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(height: _screenSize.height * 0.02),
                  Padding(
                    padding: EdgeInsets.only(left: _screenSize.width * 0.04),
                    child: Text(
                      "Recommanded",
                      style: TextStyle(
                        fontSize: _screenSize.width * 0.055,
                        color: Colors.blue,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                  SizedBox(height: _screenSize.height * 0.01),
                  SizedBox(
                    height: _screenSize.height * 0.3,
                    child: FutureBuilder<List<PropertyModel>>(
                      future: _propertyData,
                      builder: (context, snapshot) {
                        if (snapshot.hasData) {
                          List<PropertyModel>? data = snapshot.data;
                          return ListView.builder(
                            shrinkWrap: true,
                            padding: EdgeInsets.only(
                                left: _screenSize.width * 0.015),
                            scrollDirection: Axis.horizontal,
                            physics: const BouncingScrollPhysics(),
                            itemCount: data!.length,
                            itemBuilder: (context, index) {
                              return RecommendedItems(
                                id: data[index].id,
                                propertyName: data[index].name,
                                price: data[index].price,
                                imgUrl: data[index].img[2],
                                bedRoomQuantity: data[index].details.bedroom,
                                bathRoomQuantity: data[index].details.bathroom,
                                propertyArea: data[index].details.area,
                                address: data[index].address.city,
                                propertyType: data[index].details.propertytype,
                              );
                            },
                          );
                        } else if (snapshot.hasError) {
                          return Center(
                            child:
                                Text("Please Check Your Internet Connection"),
                          );
                        }
                        // By default show a loading spinner.
                        return ListView.builder(
                            itemCount: 4,
                            shrinkWrap: true,
                            padding: const EdgeInsets.only(left: 10),
                            scrollDirection: Axis.horizontal,
                            physics: const BouncingScrollPhysics(),
                            itemBuilder: (ctx, index) {
                              return RecommendedShimmer();
                            });
                      },
                    ),
                  ),
                ]),
          ),
          // ),
        ]),
      ),
    );
  }
}

'''

CodePudding user response:

Try changing your setState() method to this:

setState(() async {
  _propertyData = await PropertyApi.getProperty();
});

CodePudding user response:

Try this :

Future<void> _refreshData() async {
    _propertyData = PropertyApi.getProperty();
    setState(() {});
    return;
}
  • Related