gpt4 book ai didi

firebase - 如何将 firebase 存储中的图像显示到小部件中?

转载 作者:IT王子 更新时间:2023-10-29 06:37:13 24 4
gpt4 key购买 nike

我想将保存在 firebase storage 中的图像显示到一个小部件中,该小部件在我的屏幕上显示 profile picture。目前我可以获得下载 url 但不确定如何使用该 url 将图像显示到小部件中。这是显示我想用来自 firebase 的图像更新的 profile picture UI 的代码(即在 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);

}

我是否需要使用 NetworkImagecached-network-imagecache_image 小部件来实现此目的?

最佳答案

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,

关于firebase - 如何将 firebase 存储中的图像显示到小部件中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53299919/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com