web-dev-qa-db-fra.com

Image de charge flottante à partir de Firebase Storage

Je vois qu'il y a beaucoup d'exemples sur la façon de télécharger une image en utilisant le scintillement vers le stockage firebase, mais rien sur le téléchargement/la lecture/l'affichage d'une image déjà téléchargée. 

Sous Android, j’ai simplement utilisé Glide pour afficher les images, comment puis-je le faire dans Flutter? Est-ce que j'utilise la classe NetworkImage et si oui, comment puis-je obtenir d'abord l'URL de l'image stockée dans Storage?

dartflutter
6
spongyboss

 Firebase Console

Pour voir les images dans votre stockage, vous avez besoin du nom du fichier dans le stockage. Une fois que vous avez le nom de fichier de l’image spécifique dont vous avez besoin .

final ref = FirebaseStorage.instance.ref().child('testimage');
// no need of the file extension, the name will do fine.
var url = await ref.getDownloadURL();
print(url);

Une fois que vous avez l'URL,

Image.network(url);

C'est tout :)

1
Manoj Perumarath

Voici un exemple de widget avec état qui charge une image à partir d'un objet Firebase Storage et crée un objet Image:

class _MyHomePageState extends State<MyHomePage> {

  final FirebaseStorage storage = FirebaseStorage(
      app: Firestore.instance.app,
      storageBucket: 'gs://my-project.appspot.com');

  Uint8List imageBytes;
  String errorMsg;

  _MyHomePageState() {
      storage.ref().child('selfies/me2.jpg').getData(10000000).then((data) =>
                setState(() {
                  imageBytes = data;
                })
        ).catchError((e) =>
                setState(() {
                  errorMsg = e.error;
                })
        );
  }

  @override
  Widget build(BuildContext context) {
    var img = imageBytes != null ? Image.memory(
        imageBytes,
        fit: BoxFit.cover,
      ) : Text(errorMsg != null ? errorMsg : "Loading...");

    return new Scaffold(
        appBar: new AppBar(
          title: new Text(widget.title),
        ),
        body: new ListView(
          children: <Widget>[
            img,
          ],
        ));
  }
}

Notez que l'initialisation FirebaseApp est gérée par la classe Firestore; aucun autre code d'initialisation n'est donc nécessaire.

0
Alexander Ryzhov