如何在颤振中显示来自firebase存储的图像?

时间:2021-03-13 13:34:00

标签: android firebase flutter firebase-storage

enter image description here

这是我的仓库。我希望图像直接显示在我的应用程序上。请求到达存储,我从统计中查看。但是不能接受,我也把规则改成每个人都可以下载。但还是什么都没有。我尝试了此页面的解决方案:Flutter Load Image from Firebase Storage 但它们根本不起作用。也许我把代码放错了地方,我不知道。我该怎么做呢?你能帮忙吗?这是我的 main.dart 的完整代码:

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++;
    });
  }

  Widget _buildListItem(BuildContext context, DocumentSnapshot document) {
    String mezunD;

 

    if (document.data()['mezunDurumu'] == false) {
      mezunD = "mezun değil";
    }
    if (document.data()['mezunDurumu'] == true) {
      mezunD = "mezun";
    }
    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),
          ),
          //I wanna show image right under these.
        ],
      ),
    );
    return listTile;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Öğrenci Durumu"),
      ),
      body: StreamBuilder(
          stream: FirebaseFirestore.instance.collection('tablo').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]),
            );
          }),
    );
  }
}

1 个答案:

答案 0 :(得分:1)

如果您单击图像上的 firebase 存储,则可以在右侧看到图像的预览。在此预览下是一个蓝色链接。如果您点击蓝色链接,您将在浏览器中以完整尺寸打开图像,其中包含包含访问令牌的完整图像地址。复制此浏览器窗口的完整 url 并在 flutter 中使用它。例如:

Image.network(url);

或包“cached_network_image”