如何在flutter应用程序中静态显示从firebase存储下载的图像，可以点击打开查看

Question

如何在flutter应用中静态显示从firebase存储下载的图片，一键打开查看

我已经将相机和图库中的图像上传到 Firebase 存储。现在我想从 firebase 存储下载图像并规定下载的图像将很容易地保留在应用程序中而不会消失。

我的意思是每当用户访问那个 flutter 应用程序屏幕时，应该显示下载的图像。

使用 firebase 存储上传图像：

   final FirebaseStorage _storage =
  FirebaseStorage(storageBucket: 'gs://flutter-imageupload-cb66a.appspot.com');
      StorageUploadTask _uploadTask;
      _startUpload() async {
    String imagePath = 'DeviceImages/DeviceImage${DateTime.now()}.png';
    final StorageReference storageReference = FirebaseStorage().ref().child(imagePath);
    final StorageUploadTask uploadTask = storageReference.putFile(imageFile1);
    await uploadTask.onComplete;
    _addPathToDatabase(imagePath);
       print("Image uploaded");
    setState(() {
      _uploadTask =
          _storage.ref().child(imagePath).putFile(imageFile1);
    });
  }

使用了 firebase_storage: ^3.1.6 和 firebase_database:

使用 image_picker: ^0.6.7+17 从相机和画廊中挑选图像。

Answer 1

要从 firebase 存储下载图像，请尝试以下操作：

final StorageReference storageReference = FirebaseStorage().ref().child(imagePath);
final UploadTask uploadTask = storageReference.putFile(imageFile1);
uploadTask.then((res) {
   res.ref.getDownloadURL();
});

UploadTask 扩展了 Future class 因此您可以使用 then() 注册一个回调，它将在未来 returns 结果之后调用。然后，您将能够使用方法 getDownloadUrl().

获得 url

获得 url 后，您可以使用 CachedNetworkImage class 并执行以下操作：

CachedNetworkImage(
  imageUrl: imgUrl,
);

您需要先下载安装包：

https://pub.dev/packages/cached_network_image

在此处查看有关如何显示来自 Internet 的图像的指南：

https://flutter.dev/docs/cookbook/images/network-image

https://flutter.dev/docs/cookbook/images/cached-images

如何在flutter应用程序中静态显示从firebase存储下载的图像，可以点击打开查看

How to show the image downloaded fom the firebase storage always in a flutter application statically,can be opened and viewed on a click

imageurl

dart

firebase

flutter

firebase-storage