Flutter ListView 跳转到顶部 [英] Flutter ListView Jumps To Top

查看:91
本文介绍了Flutter ListView 跳转到顶部的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在为我的应用创建新闻提要,当我向下滚动时,数据是从 Firestore 获取的.一旦我向上滚动,列表视图就会直接捕捉到最顶部,跳过中间的所有其他项目.如果我使用静态数据加载列表视图,它可以正常工作,但是当我从 Firestore 中提取数据时,问题再次出现.我不确定是什么导致了这种行为.

I am creating a news feed for my app and as I scroll down data is fetched from Firestore. As soon as I scroll up the listview literally snaps to the very top skipping all the other items in between. The listview works fine if I load it with static data but when i pull data from Firestore, the issue reemerges. I am not sure what's causing this behaviour.

演示不规则滚动行为的视频

这是我的代码

return StreamBuilder(
            stream: Firestore.instance.collection(Constants.NEWS_FEED_NODE)
                .document("m9yyOjsPxV06BrxUtHdp").
            collection(Constants.POSTS_NODE).orderBy("timestamp",descending: true).snapshots(),
            builder: (BuildContext context, AsyncSnapshot snapshot) {
              if (!snapshot.hasData)
                return Center(child: CircularProgressIndicator(),);

              if (snapshot.data.documents.length == 0)
                return Container();
              //after getting the post ids, we then make a call to FireStore again
              //to retrieve the details of the individual posts
              return ListView.builder(
                  itemCount: snapshot.data.documents.length,
                  itemBuilder: (_, int index) {
                    return FeedItem2(feed: Feed.fireStore(
                        snapshot: snapshot.data.documents[index]),);
                  });
            },
          );

推荐答案

刚刚在使用 Flutter 1.17.3 时遇到了同样的问题.基于@Ashton-Thomas 的评论:Flutter ListView 跳转到顶部我补充说:

Just had the same issue using Flutter 1.17.3. Based on the comment from @Ashton-Thomas here: Flutter ListView Jumps To Top I added:

cacheExtent: estimatedCellHeight * numberOfItems,

到我的 ListView 构造函数,问题就消失了.它也大大提高了整个列表的响应能力.

to my ListView constructor and the problem went away. It has drastically increased the responsiveness of the entire list as well.

注意:我的列表中只有大约 50 个项目,所以 cacheExtent 不是很高.如果您有数百/数千个项目,则可能需要进行调整.

Note: my list only has about 50 items in it, so the cacheExtent isn't extremely high. May need to adjust if you have hundreds/thousands of items.

这篇关于Flutter ListView 跳转到顶部的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆