Pictures selected have wrong orientation

[xerotolerant]

Upon selecting an image using nativescript-imagepicker plugin. Sometimes the image orientation is incorrect event though it was correct in the picker. I suspect it has something to do with the orientation which the picture was taken in however it is pretty inconsistent. Is there a way to do it internally or do I have to use an additional tool?

[Daxito]

+1

[xerotolerant]

Hey I ended up using an image cropper plugin in order to allow the user the choose the correct orientation and size. You would probably have to use an image cropper if you intend to use the image within the application anyway since the images stored on the device are probably enormous.

[Daxito]

@xerotolerant Can you share the plugin? is there a demo by any chance?
Thanks!

[xerotolerant]

I think it was this one.
https://github.com/bthurlow/nativescript-imagecropper

I am not 100% sure though. It was a long time ago and I have since moved away from nativescript.

but basically after you choose the image and the promise returns the image. In your success function immidiately invoke the image cropper. Once the user uses it it returns the cropped image at the size it appears on screen (or a size you choose). A 4MB 12MP photo would then become an 800x600 4xxKB image so you can upload it or whatever from there.

I remember running out of memory after loading a few images directly from storage simply because it was too large

[Daxito]

Thank you @xerotolerant !

[erjdriver]

+1 here...

Is this plugin being maintained???

[xerotolerant]

It doesn't seem to be but I haven't encountered any problems with it. I remember being skeptical because of how long it was since the last commit. However I really had no choice. So far it hasn't let me down.

[erjdriver]

Well there's this orientation issue. I'd prefer to solve it w/o adding another plugin.

[vagabond92]

@i have only encountered this problem on Android. I obtained a hacky fix by adding:

    image.setRotationAngleFromFile(this._calculateFileUri(uri));

immediately before:

    return image; 

in the decodeUri function in viewmodel.android.ts

Then I can obtain the rotation angle from the imagesource obtained from .getImage(), and bind that to:

<Image [src]="fileUri" [rotate]="imageSource.rotationAngle">

[xerotolerant]

I don't remember myself but it might have been on android too. On a related note, have you ever run out of memory after using multiple images directly?

…

Sent from my iPhone

On 20 Jan 2017, at 10:05 PM, Jason K. Ellis ***@***.***> wrote: I have only encountered this problem on Android. I obtained a hacky fix by adding: image.setRotationAngleFromFile(this._calculateFileUri(uri)); immediately before: return image; in the decodeUri function. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[vagabond92]

Yes, I have. That's what led me to tracking down this problem. I noticed the image rotation problem on Android, and sought to remedy it by instantiating imageSource.fromFile(filename).rotationAngle. Naturally, this led to OOM error when loading a list of images because they weren't being garbage collected. I found that by employing this fix and extracting the rotation angle when choosing the image, then storing it, the imagesource instance would be garbage collected.

[vagabond92]

@tsonevn Is it possible to make it so that the imageSource that is returned from SelectedAsset.getImage() contains the rotation angle if the image is located on the android device?

I've done some testing, and it is clear that the rotation angle is not defined for images without a fileUri (located on Google Drive for example). In a previous version of imagepicker, there was an internal function in viewmodel.android.ts: image.setRotationAngleFromFile(this._calculateFileUri(uri));
which seems to have gone away in this version.

[OPADA-Eng]

Any fix for this ?