首页 > 解决方案 > Flutter Firebase ListView - 缓慢刷新

问题描述

我使用 StreamBuilder 小部件创建了一个从 Firebase 集合填充的 ListView。填充 ListView 需要一些时间,因为我正在为 Firebase 集合的每个项目运行任务(HTTP 请求),然后在列表中显示结果。

当我使用 ListView 离开页面然后返回页面(使用 PageView)时,ListView 似乎完全刷新,而不是使用上次看到的版本。因此,每次重新打开页面时都会重新填充列表,因此有一个约 5 秒的循环进度指示器。

问题:

代码:

class AccountsPage extends StatefulWidget {
  @override
  _AccountsPageState createState() => _AccountsPageState();
}

class _AccountsPageState extends State<AccountsPage> {
  User user;

  Widget _buildListItem(BuildContext context, DocumentSnapshot document, String uuid) {

    // get data from firebase
    String token = document.data.values.toList()[0];

    // For current document/token, make an HTTP request using the token and return relevant data
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Flexible(
          child: FutureBuilder(
          future: anHTTPrequest(token, uuid),
          builder: (context, projectSnap) {
            if (projectSnap.connectionState == ConnectionState.none ||
                !projectSnap.hasData || projectSnap.data.length == 0) {
              return Container();
            }
            return ListView.builder(
              shrinkWrap: true,
              itemCount: projectSnap.data.length,
              itemBuilder: (context, index) {
                return ListTile(
                  title: Text(projectSnap.data[index]),
                );
              },
            );
          },
        ),
      )],
    );
  }

  @override
  Widget build(BuildContext context) {
    final container = StateContainer.of(context);
    user = container.user;
    return Container(
      child: Scaffold(
        body: Column(
          children: <Widget>[
            new Flexible(
              child: StreamBuilder(
                stream: Provider.of(context).collectionRef.document(user.uuid).collection('tokens').snapshots(),
                builder: (context, snapshot){
                  if (!snapshot.hasData){
                    return Container(
                      child: Center(
                        child: Text("No data")
                      )
                    );
                  }

                  return ListView.builder(
                    padding: EdgeInsets.all(8.0),
                    reverse: false,
                    itemCount: snapshot.data.documents.length,
                    itemBuilder: (context, int index) {
                      return _buildListItem(context, snapshot.data.documents[index], user.uuid);
                    }
                  );        
                }
              )

            ),
          ]
        ),
      ),
    );
  }
}

标签: firebaselistviewfluttergoogle-cloud-firestoresqflite

解决方案


推荐阅读