Image Size Changed After Upload To Firebase Storage - ios

Question

imageToUpload is 375x500 here. After uploading to Firebase Storage, the width and height was doubled. Is there a way to keep the size unchanged after uploading to Firebase Storage?
if let uploadData = UIImageJPEGRepresentation(imageToUpload, 0.0) {
uploadImageRef.putData(uploadData, metadata: nil) { (metadata, error) in
if error != nil {
print("error")
completion?(false)
} else {
// your uploaded photo url.
// Metadata contains file metadata such as size, content-type.
let size = metadata?.size
// You can also access to download URL after upload.
uploadImageRef.downloadURL { (url, error) in
guard let downloadURL = url else {
// Uh-oh, an error occurred!
completion?(false)
return
}
print("Download url : \(downloadURL)")
completion?(true)
}
}
}
}
Note that I am using the extension below to change image size to 375x500 (size of imageToUpload) before uploading.
extension UIImage {
func resized(to size: CGSize) -> UIImage {
return UIGraphicsImageRenderer(size: size).image { _ in
draw(in: CGRect(origin: .zero, size: size))
}
}
}
let imageToUploadResize:UIImage = image.resized(to: CGSize(width: 375.0, height: 500.0))

Answer 1

As I had mentioned in my comment, IMO, the function in the extension is really being called like a standalone function and not really extending the functionality. I would suggest making it a function to resize a passed in image and return a new image.
Using this function, your image will be resized to the correct size and uploaded at that size (verified that it works)
func resizeImage(image: UIImage, targetSize: CGSize) -> UIImage {
let rect = CGRect(x: 0, y: 0, width: targetSize.width, height: targetSize.height)
UIGraphicsBeginImageContextWithOptions(targetSize, false, 1.0)
image.draw(in: rect)
let newImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
return newImage!
}
and then called like this
let updatedSize = CGSize(width: 300.0, height: 400.0)
let resizedImage = self.resizeImage(image: origImage!, targetSize: updatedSize)
Now to address the issue with the extension at a 10k foot level.
It all goes back to points vs how it's rendered on an iDevice. Back with the iPhone 2g, 3g, it was 1-1 for rendering so if you ran your code on that device in the simulator and set the image size to 320x480, it would have been a 320x480 image stored in firebase. However, as screens improved and resolutions went up, so did the rendering, which affects the UIImage.
So if you were to set your project to simulate on an iPhone 6, that same image would be 640x960 (2x) and then to iPhone 8+, the size is 960 x 1440 (3x). (there is upsampling involved so we are ignoring it here).
The UIImage knows what device it's on so that should be taken into consideration.
Again, this is generically speaking and there are a lot of other components involved, in particular, pixels = logicalPoints * scaleFactor

Answer 2

Try using the resizing image code provided by the following resource. Your extension creates a new instance of the image and returns it rather than updating the actual image itself.
If you want to keep on using your extension, I would suggest trying
extension UIImage {
func resized(to size: CGSize) {
self = UIGraphicsImageRenderer(size: size).image { _ in
draw(in: CGRect(origin: .zero, size: size))
}
}
}