Search code examples
flutterdartimagepicker

Flutter Resize ImagePicker Image before uploading to firebase

I am building a demo wallpaper app using flutter where users can upload images to firebase. When loading those images I first want to load a small version of the image and only once the user clicks on the image, load the full version. In order to achieve this I thought I would simply upload 2 versions in the background once a user picks the image. Now I am struggling with how to achieve this.

Here is how the user picks the image using ImagePicker into a file var.

Future pickImage() async {
var tempImage = await ImagePicker.pickImage(source: ImageSource.gallery, maxHeight: 2000);
print(tempImage.runtimeType);


setState(() {
  inspirationimage = tempImage;
});
String result = await uploadImage();
}

As you can see the tempimage is the full size version. I would now have sth like this:

var smallImage = tempImage.resize(height: 200);

Obviously this does not work as tempImage is of type file. Any ideas how this is usually solved?

Thanks

Solution

  • Since you are using Firebase, you can use the Firebase "Resize Image" extension. If you want to do it on client side however, take a look at this answer.