在Firebase动画列表中，有没有办法让Firebase列表知道小部件在加载之前的预期高度? [英] In a firebase animated list, is there a way to let firebase list know the expected height of a widget before it loads?

问题描述

有没有一种方法可以明确告诉Firebase动画列表特定小部件的高度?在我的情况下，firebase列表中的每个项目都有一个基于子级数的可变大小(这是一个注释线程).每当大螺纹离开视口(在视口上方)并被丢弃并且忘记高度时，这会导致烦人的阻塞和尝试向上滚动时的失败.

Is there a way to explicitly tell a firebase animated list what the height of a specific widget should be? In my case, each item in the firebase list has a variable size based on a number of children (it's a comment thread). Whenever a large thread is out (above) of the viewport it is disposed of and the height is forgotten, this leads to annoying blocking and failure when trying to scroll back up.

这是我的主题:

new FirebaseAnimatedList(
        defaultChild: new DefaultThreadView(),
        query: ref.child(postKey),
        sort: (a, b) => (a.key.compareTo(b.key)),
        itemBuilder: (context, DataSnapshot snapshot,
            Animation<double> animation) {
          return new FutureBuilder<DataSnapshot>(
              future: ref.child(postKey).child(snapshot.key).once(),
              builder: (BuildContext context,
                  AsyncSnapshot<DataSnapshot> snap) {
                switch (snap.connectionState) {
                  case ConnectionState.none:
                    return new Center(
                        child: new CircularProgressIndicator());
                  case ConnectionState.waiting:
                    return new Center(
                        child: new CircularProgressIndicator());
                  default:
                    if (!snap.hasData) {
                      return new Text('Error: ${snap.error}');
                    }
                    else {
                      //check if this snap is a root node
                      String parent = snap.data.value['parent'];

                      if (parent == this.postKey) {
                        return new replyTile.ReplyTile(
                            snap.data, animation, this.postKey, 0);
                      } else {
                        return new Container();
                      }
                    }
                }
              }
          );
        }

    )

reply tile是一个小部件，用于显示数据并检查其是否有子级以及是否递归.

the reply tile is a widget to display the data and checks if it has any children and if it does it recurses.

每当顶级父答复图块离开视口时，它就会按预期方式放置，但是当尝试使其返回视图时，它将右滚动到顶部并看起来非常跳跃，甚至在更大的线程(有多个子代数)时更糟尝试重新进入视图，它根本不会滚动.

Whenever a top parent reply tile goes out of the viewport it is disposed as expected but when trying to bring it back into view it scrolls right to the top and looks very jumpy, even worse whenever a bigger thread(with multiple children) tries to come back into view it doesn't scroll at all.

我认为如果列表视图知道高度，滚动问题就会消失，但我可能是错的

I think if the list view was aware of the height the scroll problem would go away but I could be wrong

更糟糕的情况下，如何使它不暴露小部件并从头开始加载整个线程?

Worse case how do I make it so the widget is not exposed and the whole thread is loaded from the start?

推荐答案

您正在执行异步加载，而用户正在浏览列表，并使用这些异步加载的结果来设置列表项的高度.这会导致在重建旧项目时出现滚动问题，因为旧项目的高度在创建时尚不可用.

You're doing asynchronous loading while the user is scrolling through the list and using the results of those asynchronous loads to set the height of your list items. This is leading to scrolling problems when rebuilding old items since their height isn't available at the moment they are built.

您可以尝试将整个线程加载到Map中，并使用常规的ListView来构建窗口小部件.这样，所有数据都将存储在内存中，以便您在需要时读取.滚动查看新内容(无进度指示器)时，这将带来更好的用户体验，但是当数据更改时，您将不会获得更新，并且对于超长线程，可能会用光内存.请记住，FirebaseAnimatedList仍然会在内存中维护初始查询的完整结果列表，例如其他平台上的Firebase数据库UI.

You could try loading whole thread into a Map and build your widgets with a regular ListView. That way all the data is there in memory for you to read when you need it. This would lead to a better user experience when scrolling to see new content (no progress indicators), but you wouldn't get updates when data changes and you might run out of memory for exceptionally long threads. Keep in mind that FirebaseAnimatedList maintains the full list of results from the initial query in memory anyway, like Firebase Database UI on other platforms.

如果您不喜欢该选项，则可以将完整的快照缓存在可以从中读取的地图中，以便在滚动回旧图块时永远不会显示加载指示符.如果不实现某种驱逐逻辑，您仍然可能会用光内存，但是在实践中不太可能发生这种情况.

If you don't like that option, you could cache the completed snapshots in a Map that you can read from so a loading indicator is never displayed when scrolling back to an old tile. You could still run out of memory if you don't implement some kind of eviction logic but it's less likely to happen in practice.

还没有一种方法可以对FirebaseAnimatedList进行分页，但是我一直在考虑添加它.

There isn't a way to paginate FirebaseAnimatedList yet, but I've been thinking about adding that.

这篇关于在Firebase动画列表中，有没有办法让Firebase列表知道小部件在加载之前的预期高度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！