Как отобразить изображение из хранилища Firebase в виджет?

Question

Я хочу отобразить изображение, сохраненное в firebase storage, в виджет, который показывает profile picture на моем экране. В настоящее время я могу получить download url, но не уверен, как использовать этот URL, который будет отображать изображение в виджете. Вот код, который отображает profile picture пользовательский интерфейс, который я хочу обновить с помощью изображения из firebase (т.е. внутри ClipOval виджета)

@override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('Edit Profile'),
          actions: <Widget>[
            new Center(child: new Text('SAVE')),
          ],
        ),
        body: new Stack(
          children: <Widget>[
            Positioned(
              width: 410.0,
              top: MediaQuery
                  .of(context)
                  .size
                  .height / 25,
              child: Column(children: <Widget>[
                Container(
                  child: user.profilePhoto == ""
                      ? Image.asset('icons/default_profile_icon.png',
                      height: 110.0)
                      : ClipOval(
                    child: _imageFile == null ? Image.asset('icons/default_profile_icon.png', height: 110.0,)
                    :Image.file(_imageFile,fit: BoxFit.cover,
                    width: 110.0,
                    height: 110.0,)
                  ),
                ),

Вот как я получаю изображение с firebase storage, которое возвращает URL для загрузки:

   displayFile(imageFile) async {

    String fileName = 'images/profile_pics/' + this.firebaseUser.uid + ".jpeg";
    var data = await FirebaseStorage.instance.ref().child(fileName).getData(10000000);
    var text = new String.fromCharCodes(data);
    return new NetworkImage(text);

  }

Нужно ли использовать для этого виджет NetworkImage или cached-network-image или cache_image?

Answer 1

Пусть NetworkImage сделает загрузку

var ref = FirebaseStorage.instance.ref().child(fileName)
String location = await ref.getDownloadURL();
return new NetworkImage(downloadUrl);

обновление

String _imageUrl;

void initState() {
  super.initState();

  var ref = FirebaseStorage.instance.ref().child(fileName)
  ref.getDownloadURL().then((loc) => setState(() => _imageUrl = loc));
}

...

        child: _imageUrl == null ? Image.asset('icons/default_profile_icon.png', height: 110.0,)
                :ImageNetwork(_imageUrl,fit: BoxFit.cover,