簡體   English   中英

如何在 Flutter 上用 FutureBuilder 添加 RefreshIndicator

[英]How to add RefreshIndicator with FutureBuilder on Flutter

我需要在未來的構建器上使用刷新指示器小部件實施拉動刷新操作。 首先,我知道這個話題有多個話題。 但我還是做不到。 這是我關於這個主題的代碼:

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),
                                                ),],),],),),),),],),);},);}),),],);
                          

我已經上傳了所有代碼,以防您想使用所有代碼自己嘗試。 我應該在哪里使用這些刷新指示器代碼:

RefreshIndicator(
                onRefresh: () {},),     

       

添加密鑰

GlobalKey _key = GlobalKey();

然后將上一個鍵分配給頂部小部件

return RefreshIndicator(
    onRefresh: _refresh,
    child: Container(
      key: _key,
      child: ListView(
      physics: AlwaysScrollableScrollPhysics(),
      children: [
        // do your stuff
      ],
    ),
  ),
);

然后刷新function,因為你應該更新密鑰

Future<void> _refresh() async {
    if (mounted) {
   _key = GlobalKey();
   setState(() {});
   }
  Future.value(null);
 }

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM