firebase - 努力将图像从Firebase Firestore加载到Flutter应用程序中的ListItem中

Question

将Firebase Firestore数据库中的图像加载到Flutter应用程序时出现问题。由于目前尚不知道该怎么办，因此我对此颇为困惑。我已经看到了一种使用NetworkImage在列表图块上下载图像的方法，但是它仅处理一个图像。我正在尝试找出一种对Firestore数据库中的每个项目使用单独的图像的方法。
我已将imageURL从Firebase存储连接到Firestore，并在imageURL键(它是字符串)下。但是我仍然在努力寻找方法。我还下载了所有依赖项，例如Firebase和Firestore。如果有人愿意提供帮助或分享有关如何使用类似方法的提示，将不胜感激! :)

class HomeTab extends StatefulWidget {
  @override
  _HomeTabState createState() => _HomeTabState();
}

class _HomeTabState extends State<HomeTab> {
  

  @override
  Widget build(BuildContext context) {

// This will reference our posts collection in Firebase Firestore NoSQL database.
CollectionReference posts = FirebaseFirestore.instance.collection('posts');

return Center(
  child: Container(
    width: 250,
    child: StreamBuilder<QuerySnapshot>(
      // Renders every post from the Firebase Firestore Database.
      stream: posts.snapshots(),
      builder: (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
        if (snapshot.hasError) {
          return Text('Something went wrong');
        }

        if (snapshot.connectionState == ConnectionState.waiting) {
          return Text("Loading");
        }

        return new ListView(
          children: snapshot.data.docs.map((DocumentSnapshot document) {

            return Card(
              margin: EdgeInsets.all(20.0),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(15.0),
              ),
              elevation: 10,
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [

                  ListTile(
                    // Renders the title on every single listview.
                    title: new Text(document.data()['title']),
                    // leading: new NetworkImage(''),
                    onTap: () {

                      Navigator.of(context).push(
                        MaterialPageRoute(
                          builder: (context) => ReaderPage(),
                        ),
                      );

                    },
                  ),


                  

                ],

                // Added Column
                // In case if things don't work, go back to this.
                // child: new ListTile(
                //   title: new Text(document.data()['text']),
                // ),
              ),
            );
          }).toList(),

        );
      },
    ),
  ),
);


}

}

Here is my Firebase Storage
My Firestore database

Answer 1

NetworkImage类不是flutter小部件类。它负责从提供的URL下载图像。它继承自ImageProvider类。
从 flutter 文档:

Fetches the given URL from the network, associating it with the given scale.

Use Image.network for a shorthand of an Image widget backed by NetworkImage.

您应该使用 Image.network小部件的名为构造函数 Image来创建用于在 NetworkImage的帮助下显示图像的flutter小部件。
您应将小部件树中的 NetworkImage替换为:

new Image.network("/image/W98kA.png")