Флаттер: FutureBuilder загружает все одновременно?

Question

В моем приложении есть функция создания сводок по книгам. Теперь, поскольку у меня нет денег для размещения API, я использую базу данных Firebase/Firestore, в которую я добавляю сводки вручную, а затем извлекаю данные из firebase в App.

Я использую FutureBuilder для этого.Теперь, скажем, у меня есть 10 сводок, FutureBuilder сначала загрузит все 10 из них, а затем отобразит данные на экране (который является ListView.builder и может отображать только 2 резюме без прокрутки), или он загрузит только те данные, которые необходимо нарисовать.на экране, как просто ListView.builder.

// code to retrieve data:

Future<QuerySnapshot> getFeedsfromFb() async {
  var data = await Firestore.instance
      .collection('feedItem')
      .orderBy('feedId', descending: true).getDocuments();
  return data;
}

// building widget:

Widget feed() {
  return Container(
    width: deviceWidth,
    height: deviceHeight / 3,
    child: FutureBuilder(
        future: getFeedsfromFb(),
        builder: (BuildContext context, AsyncSnapshot snapshot) {
          if (snapshot.hasData) {
            return ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: snapshot.data.documents.length > 10
                  ? 10
                  : snapshot.data.documents.length,
              itemBuilder: (BuildContext context, int index) {
                return Container(
                  width: deviceWidth / 2.5,
                  child: GestureDetector(
                    onTap: () {
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (BuildContext context) => FeedIntro(
                                  snapshot.data.documents[index]['feedId'])));
                    },
                    child: Card(
                        child: Column(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: <Widget>[
                        Container(
                          // width: 150,
                          height: 150,
                          foregroundDecoration: BoxDecoration(
                              image: DecorationImage(
                                  image: NetworkImage(
                                    snapshot.data.documents[index]['feedImage'],
                                  ),
                                  fit: BoxFit.fill)),
                        ),
                        Center(
                            child: Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Text(snapshot.data.documents[index]['title']),
                        )),
                      ],
                    )),
                  ),
                );
              },
            );
          } else if (snapshot.hasError) {
            return Center(child: Text('Sorry Something went wrong!'));
          } else {
            return Center(
              child: SizedBox(
                child: CircularProgressIndicator(),
                width: 50,
                height: 50,
              ),
            );
          }
        }),
  );
}

Answer 1

Ваш FutureBuilder загрузит все элементы одновременно, но только необходимые данные ListView.builder будут отображены на экране.