I am trying to display images from Firebase Firestore referring to the current user.
Here is the part of my code where I create the functions to open the gallery, upload it to Firestorage and Firestore:
File _image;
final ImagePicker _picker = ImagePicker();
Future getImage(bool gallery) async {
ImagePicker picker = ImagePicker();
PickedFile pickedFile;
// Let user select photo from gallery
if (gallery) {
pickedFile = await picker.getImage(
source: ImageSource.gallery,
);
}
setState(() {
if (pickedFile != null) {
_image = File(pickedFile.path); // Use if you only need a single picture
} else {
print('No image selected.');
}
});
}
Future<String> uploadFile(File image) async {
String downloadURL;
Reference ref = FirebaseStorage.instance
.ref()
.child("images/${_firebaseAuth.currentUser.uid}");
await ref.putFile(image);
downloadURL = await ref.getDownloadURL();
return downloadURL;
}
Future uploadToFirebase() async {
final CollectionReference users =
_firebaseFirestore.collection("Companies");
final String uid = _firebaseAuth.currentUser.uid;
String url = await uploadFile(
_image); // this will upload the file and store url in the variable 'url'
await users.doc(uid).update({
//use update to update the doc fields.
'url': url
});
final result = await users.doc(uid).get();
return result.data()["url"];
}
Now, here is the code where I am trying to display the image:
Row(
children: [
Text(
"Company profile picture: ",
style: TextStyle(
color: Colors.black,
fontSize: 20.0,
),
),
],
),
SizedBox(
height: 20.0,
),
Container(
child: Stack(
children: <Widget>[
Align(
alignment: Alignment.center,
child: IconButton(
icon: Icon(Icons.camera_alt),
onPressed: () async {
getImage(true);
},
),
),
Container(
child: _image != null
? Container(
height: 100,
width: 100,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(50),
image: DecorationImage(
image: FileImage(
_image), // Here needs to be the image from Firestore referring to the current user
),
),
)
: Container(
decoration: BoxDecoration(
color: Colors.grey[200],
borderRadius:
BorderRadius.circular(50),
),
width: 100,
height: 100,
child: Icon(
Icons.camera_alt,
color: Colors.grey[800],
),
),
),
],
),
),
Row(
children: [
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.black,
),
child: Text(
"Submit",
style: TextStyle(color: Colors.white),
),
onPressed: () async {
uploadFile(_image);
uploadToFirebase();
},
),
],
),
As you can see, this part here:
Container(
child: _image != null
? Container(
height: 100,
width: 100,
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(50),
image: DecorationImage(
image: FileImage(
_image), // Here needs to be the image from Firestore referring to the current user
),
),
)
Is where I want to add the Image from the Firestore referring to the current user. The way it is now, using image: FileImage(_image), just show the image hen the user select it, but when he closes the app, or logout, when the user log in again, the image is gone, it is like, setting to null, so I am struggling to find a good tutorial on how to display the image from Firestore even after logging out and in again.