Display out my images stored in Firebase Storage by referring to the lists of image paths in my Firestore Database


enter image description here

So, I have this document that contains a list of image path that its file have been stored inside Firebase Storage. So my problem here is, how can I use future builder to load out all the images.

I have try to display out a single file with this method and its works but I just cant connect the way to display out all the file by using Future Builder.

   future: storage.downloadURL(annData.imagePath),
   builder: (BuildContext context,
       AsyncSnapshot<String> snapshot) {
   if(snapshot.connectionState == ConnectionState.done && snapshot.hasData)
     return Container(
       width: 200,
       height: 200,
        child: InteractiveViewer(
           child: AspectRatio(
             aspectRatio: 1,
               child: ClipRRect(
                 child: Image.network(
                   fit: BoxFit.contain,
   if(snapshot.connectionState == ConnectionState.waiting)
       return Loading();
     return Container();

And this is my downloadURL method

Future<String> downloadURL(String imagePath) async {
  String downloadURL = await FirebaseStorage.instance.ref('test/$imagePath').getDownloadURL();

  return downloadURL;

My imagePath in database is a List.


As suggested by @Frank van Puffelen,If you have an array of image paths, you’ll want to loop over those and generate a separate FutureBuilder for each of them.

Answered By – Sathi Aiswarya

Answer Checked By – Robin (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *