Flutter get image from firebase storage and show it in app for download

Question

I am trying to get an Image from firebase storage (url in the firebase firestore) and show it in my app with like a filter.

My code( it doesn't work):

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:pap_test/upload/upload_resumos_screen.dart';

class DownloadScreen extends StatefulWidget {
  const DownloadScreen({Key? key}) : super(key: key);
  static const routeName = '/downlaod-resumos';

  @override
  State<DownloadScreen> createState() => _DownloadScreenState();
}

class _DownloadScreenState extends State<DownloadScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Resumos'),
      ),
      body: StreamBuilder(
        stream: FirebaseFirestore.instance.collection('courses').snapshots(),
        builder: (context, AsyncSnapshot snapshot) {
          return ListView.builder(
            itemCount: snapshot.data.documents.length,
            itemBuilder: (context, index) {
              DocumentSnapshot image = snapshot.data!.documents[index];
              return ListTile(
                leading: Image.network(
                  image['disciplina'],
                ),
                title: Text(image['modulo']),
                subtitle: Text('11'),
              );
            },
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // Add your onPressed code here!
          Navigator.of(context).pushNamed(UploadResumoScreen.routeName);
        },
        backgroundColor: Color.fromARGB(255, 28, 209, 216),
        child: const Icon(Icons.add),
      ),
    );
  }
}

I have created, for each image, a document, in the document i saved the disciplina and modulo (the things im trying to filter with), and the url that goes to the image that is saved in the storage.

I wanted to show them in like a listview

How i can take an image from firebase storage and the url in the firebase firestore and show it in my app with a filter?

Answer 1

Should be something like this:

import 'package:firebase_storage/firebase_storage.dart' as firbaseStorage;

firbaseStorage.Reference storageRef = storage.ref('NameOfFolder');
......
final imgUrl = await storageRef
        .child('ImagePath')
        .getDownloadURL();

For Storage check out the docs. If you have to loop thorugh async list function try look at these answers as well.