Question

我正在尝试实现“水平列表视图”，但是由于我是新手，因此很难。我不断收到很多错误，这次是：“列表

new StreamBuilder(
          stream: db
              .collection('messages')
              .orderBy('timestamp', descending: true)
              .snapshots(),
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return snapshot.data.documents.map((doc) {
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Container(
                      height: 350.0,
                      child: ListView.builder(
                        physics: NeverScrollableScrollPhysics(),
                        itemCount: 3,
                        controller: scrollController,
                        scrollDirection: Axis.horizontal,
                        itemBuilder: (context, position) {
                          return GestureDetector(
                            child: Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Card(
                                child: Container(
                                  width: 250.0,
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: <Widget>[
                                      Padding(
                                        padding: const EdgeInsets.all(8.0),
                                        child: Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: <Widget>[
                                            Padding(
                                              padding: const EdgeInsets
                                                      .symmetric(
                                                  horizontal: 8.0,
                                                  vertical: 4.0),
                                              child: Text(
                                                  '${doc.data['text']}',
                                                  style: TextStyle(
                                                      color: Colors.black)),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ],
                                  ),
                                ),
                                shape: RoundedRectangleBorder(
                                    borderRadius:
                                        BorderRadius.circular(10.0)),
                              ),
                            ),
                          );
                        },
                      ),
                    )
                  ],
                );
              }).toList();
            } else {
              return SizedBox();
            }
          },
        ),

我可以运行代码，但是ListView甚至没有构建，我在DebugConsole上收到以下错误：

I/flutter ( 3235): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY 
╞═══════════════════════════════════════════════════════════
I/flutter ( 3235): The following assertion was thrown building StreamBuilder<QuerySnapshot>(dirty, state:
 I/flutter ( 3235): _StreamBuilderBaseState<QuerySnapshot, AsyncSnapshot<QuerySnapshot>>#3ee78):
 I/flutter ( 3235): type 'List<dynamic>' is not a subtype of type 'Widget'
 I/flutter ( 3235):
 I/flutter ( 3235): Either the assertion indicates an error in the framework itself, or we should provide substantially
 I/flutter ( 3235): more information in this error message to help you determine and fix the underlying cause.
 I/flutter ( 3235): In either case, please report this assertion by filing a bug on GitHub:
 I/flutter ( 3235):   https://github.com/flutter/flutter/issues/new?template=BUG.md
 I/flutter ( 3235):
 I/flutter ( 3235): User-created ancestor of the error-causing widget was:
 I/flutter ( 3235):   Column
 I/flutter ( 3235):   file:///home/guacamole/AndroidStudioProjects/lixos/jornaleco/lib/screens/news_screen.dart:62:16
 I/flutter ( 3235):
 I/flutter ( 3235): When the exception was thrown, this was the stack:
 I/flutter ( 3235): #0      _MyHomePageState.build.<anonymous closure>

这是ListView我正在尝试执行的操作，但是使用Firebase而不是本地数组：https://medium.com/@dev.n/flutter-challenge-todo-app-concept-bd36107aa291

也许有一些简单的方法，并且我破坏了代码。我得到的只是手机上的红屏。

如果我缺少一些信息，请告诉我。感谢您的关注。

Answer 1

错误确切地告诉您哪里出了问题。

问题在这里：return snapshot.data.documents.map((doc)

您正在返回文档图。您应该返回一个小部件。您的退货声明应为return Column( ....或return ListView( ........之类。

检出this Streambuilder示例，并仔细观察return语句。

Answer 2

我假设您要在listView.builder中显示数据，所以我稍微更改了代码示例。 @Sukhi是正确的，您应该向构建器返回Widget，但是您返回List<dynamic>时，builder也只能接收一个Widget而不是List<Widget>。 / p>

new StreamBuilder(
      stream: db
          .collection('messages')
          .orderBy('timestamp', descending: true)
          .snapshots(),
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          return snapshot.data.documents.map((doc) {
            ;
          }).toList();
 Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Container(
                  height: 350.0,
                  child: ListView.builder(
                    physics: NeverScrollableScrollPhysics(),
                    itemCount: snapshot.data.documents.length,
                    controller: scrollController,
                    scrollDirection: Axis.horizontal,
                    itemBuilder: (context, position) {
                      return GestureDetector(
                        child: Padding(
                          padding: const EdgeInsets.all(8.0),
                          child: Card(
                            child: Container(
                              width: 250.0,
                              child: Column(
                                crossAxisAlignment:
                                    CrossAxisAlignment.start,
                                mainAxisAlignment:
                                    MainAxisAlignment.spaceBetween,
                                children: <Widget>[
                                  Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Column(
                                      crossAxisAlignment:
                                          CrossAxisAlignment.start,
                                      children: <Widget>[
                                        Padding(
                                          padding: const EdgeInsets
                                                  .symmetric(
                                              horizontal: 8.0,
                                              vertical: 4.0),
                                          child: Text(
                                              '${snapshot.data.documents[position]['text']}',
                                              style: TextStyle(
                                                  color: Colors.black)),
                                        ),
                                      ],
                                    ),
                                  ),
                                ],
                              ),
                            ),
                            shape: RoundedRectangleBorder(
                                borderRadius:
                                    BorderRadius.circular(10.0)),
                          ),
                        ),
                      );
                    },
                  ),
                )
              ],
            )
        } else {
          return SizedBox();
        }
      },
    ),

尝试此更正，希望如此。

水平列表视图已连接到Firebase

2 个答案: