如何将 Firebase 云数据显示为表格并显示图像？

如何解决如何将 Firebase 云数据显示为表格并显示图像？

[![在此处输入图像描述][1]][1] 我需要在这里这样做： [1]：https://i.stack.imgur.com/bNdZ3.png

但是我做不到。我尝试了一些东西，但它不起作用。下面是我的 main.dart。我创建了用于显示图像的 showImage 方法，我也通过 Image.network(url) 应用了它；代码但它不起作用，所以我评论了它。

import 'package:firebase_storage/firebase_storage.dart';
import 'package:Flutter/material.dart';
import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_core/firebase_core.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        primarySwatch: Colors.red,visualDensity: VisualDensity.adaptivePlatformDensity,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key,this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  var url;
  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  void showImage() async {
    final ref = FirebaseStorage.instance.ref().child('erkekyuz');
// no need of the file extension,the name will do fine.
    url = await ref.getDownloadURL();
    print(url);
  }

  Widget _buildListItem(BuildContext context,DocumentSnapshot document) {
    String mezunD;
    if (document.data()['mezunDurumu'] == false) {
      mezunD = "mezun değil";
    }
    if (document.data()['mezunDurumu'] == true) {
      mezunD = "mezun değil";
    }
    var listTile = ListTile(
      title: Column(
        children: [
          Expanded(
            child: Text(
              "Ad Soyad:    " + document.data()['adSoyad'],Expanded(
            child: Text(
              "Yaş:    " + document.data()['yas'].toString(),Expanded(
            child: Text(
              "Doğum Tarihi:    " + document.data()['dogumTarihi'],Expanded(
            child: Text("Mezun Durumu:    " + mezunD),//Image.network(url),//this didn't work somehow.
        ],);
    return listTile;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Öğrenci Durumu"),body: StreamBuilder(
          stream: FirebaseFirestore.instance.collection('tablolar').snapshots(),builder: (context,snapshot) {
            if (!snapshot.hasData) return const Text('Loading...');
            return ListView.builder(
              itemExtent: 100.0,itemCount: snapshot.data.documents.length,itemBuilder: (context,index) =>
                  _buildListItem(context,snapshot.data.documents[index]),);
          }),);
  }
}

解决方法

您的 url 变量是否显示任何值？ 像这样调用你的 showImage() 方法来加载图像。

@override
    void initState() {
        super.initState();
        showImage();
    }

用于显示图像，您可以使用：https://pub.dev/packages/cached_network_image