Question

我正在尝试为我的Flutter应用构建类似于Google新闻提要的结构。设计部分没有错误。我尝试了一些虚拟数据，并且小部件正确构建。当我尝试将Firestore数据转换为小部件时，该小部件将无法构建，并且屏幕上没有任何内容。下面是StreamBuilder代码

+----------+-----------+-------------------------+-------------+-------------+
|  Unique  |  Weight   |     ProductionDate      | OrderNumber | ProductCode |
+----------+-----------+-------------------------+-------------+-------------+
| 14962904 |  1.920000 | 2020-06-05 11:43:12.000 |             | ABC123      |
| 14962905 |  1.990000 | 2020-06-05 11:43:14.000 |             | ABC123      |
| 14962906 |  2.020000 | 2020-06-05 11:43:20.000 |             | ABC123      |
| 14962909 |  2.030000 | 2020-06-05 11:45:09.000 |             | ABC123      |
| 14962909 | -2.030000 | 2020-06-05 11:45:09.000 |      431723 | ABC123      |
| 14962910 |  2.020000 | 2020-06-05 11:45:15.000 |             | ABC123      |
| 14962910 | -2.020000 | 2020-06-05 11:45:15.000 |      431723 | ABC123      |
| 14962911 |  1.990000 | 2020-06-05 11:45:24.000 |             | ABC123      |
| 14962911 | -1.990000 | 2020-06-05 11:45:24.000 |      431723 | ABC123      |
+----------+-----------+-------------------------+-------------+-------------+

我的小部件代码是

+----------+-----------+-------------------------+-------------+-------------+
|  Unique  |  Weight   |     ProductionDate      | OrderNumber | ProductCode |
+----------+-----------+-------------------------+-------------+-------------+
| 14962904 |  1.920000 | 2020-06-05 11:43:12.000 |             | ABC123      |
| 14962905 |  1.990000 | 2020-06-05 11:43:14.000 |             | ABC123      |
| 14962906 |  2.020000 | 2020-06-05 11:43:20.000 |             | ABC123      |
| 14962909 |  2.030000 | 2020-06-05 11:45:09.000 |      431723 | ABC123      |
| 14962910 |  2.020000 | 2020-06-05 11:45:15.000 |      431723 | ABC123      |
| 14962911 |  1.990000 | 2020-06-05 11:45:24.000 |      431723 | ABC123      |
+----------+-----------+-------------------------+-------------+-------------+

错误是

Widget build(BuildContext context) {
    height = MediaQuery.of(context).size.height;
    width = MediaQuery.of(context).size.width;

    return Container(
        color: Colors.green[50],
        height: height,
        width: width,
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            children: <Widget>[
              SizedBox(
                height: height * 0.04,
              ),
              Container(
                height: height * 0.12,
                width: width * 0.90,
                color: Colors.green[50],
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: <Widget>[
                    Align(
                      alignment: Alignment.centerLeft,
                      child: Padding(
                        padding: EdgeInsets.only(left: width * 0.10),
                        child: Text('UPCOMING EVENTS',
                            style: GoogleFonts.tenaliRamakrishna(
                                textStyle: TextStyle(
                                    fontSize: 30,
                                    fontWeight: FontWeight.w500))),
                      ),
                    )
                  ],
                ),
              ),
              StreamBuilder<QuerySnapshot>(
                stream: Firestore.instance.collection('Events').snapshots(),
                builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
                  if (snapshot.hasError) {
                    return Center(child: Text('Error: ${snapshot.error}'),);
                  }
                  return ListView(
                    children: snapshot.data.documents
                        .map<Widget>((DocumentSnapshot document) {
                      return eventCard(
                          imageUrl: document['ImageUrl'],
                          title: document['Title'],
                          description: document['Description'],
                          venue: document['Venue'],
                          date: document['Date'],
                          time: document['Time']);
                    }).toList(),
                  );
                },
              )
            ],
          ),
        ));
  }

Answer 1

我找到了原因。这是因为在ListView小部件内使用了Column。 Column在主轴方向（垂直轴）上扩展到最大大小，ListView

也是如此

解决方案：

如果要允许Flexible占用Expanded中的整个左侧空间，请使用ListView或Column。

Column(
  children: <Widget>[
    Expanded(
      child: ListView(...),
    )
  ],
)

Answer 2

有几件事可以尝试。

1）替换

if (snapshot.hasError) {
  return Center(child: Text('Error: ${snapshot.error}'),);
 }

具有：

if (snapshot.hasError) {
  return Center(child: Text('Error: ${snapshot.error}'),);
}
if (!snapshot.hasData) {
  return Center(child: Text('No data'),);
}

这将使构建者有时间来获取数据。

2）如果看到No data，请转到Firebase控制台>数据库> firestore，并检查数据库的根目录中是否有一个名为Events的集合。检查大小写，检查是否没有多余的不可见空间。如果存在，请单击并检查其中是否有数据

Flutter Firestore和StreamBuilder

2 个答案:

解决方案：