在FutureBuilder的情况下，我应该如何获得一组可滚动的小部件而不会溢出

Question

我的代码中有一个FutureBuilder，它根据从Firestore获取的数据生成一个小部件列表。我希望屏幕可以滚动，没有任何溢出错误。这是我的代码：

          FutureBuilder<QuerySnapshot>(
              future:
                  FirebaseFirestore.instance.collection('Assignments').get(),
              builder: (BuildContext context,
                  AsyncSnapshot<QuerySnapshot> snapshot) {
                if (snapshot.hasData) {
                  return Column(
                    children: snapshot.data?.docs.map((doc) {
                          return Column(
                            children: [
                              Subject(
                                  dataMap: doc.data() as Map<dynamic, dynamic>),
                              Divide()
                            ],
                          );
                        }).toList() ??
                        [],
                  );
                } else {
                  // or your loading widget here
                  return Text("Loading....");
                }
              },
            ),

以下是我在屏幕上看到的输出：

我希望这个屏幕可以滚动。我使用了SingleChildScrollview，但这使全屏可滚动，而我只希望作业标题下的小部件列表可滚动。

Answer 1

您可以使用列表视图而不是多个列。ListView是可滚动的，所以你不应该对溢出的小部件有任何问题。列表视图。Builderconstructor获取itemCount和Builder，您只需为每个列表项返回一个小部件。

那么你的FutureBuilder应该是这样的：

FutureBuilder<QuerySnapshot>(
          future:
              FirebaseFirestore.instance.collection('Assignments').get(),
          builder: (BuildContext context,
              AsyncSnapshot<QuerySnapshot> snapshot) {
            if (snapshot.hasData) {
              return ListView.builder(
                  itemCount: snapshot.data.docs.length,
                  itemBuilder: (context, index) {
                     return Column(
                        children: [
                          Subject(
                              dataMap: snapshot.data.docs[index].data() as Map<dynamic, dynamic>),
                          Divide()
                        ],
                      );
                  },
              
              );
            } else {
              // or your loading widget here
              return Text("Loading....");
            }
          },
        ),