react-native-image-resizer
react-native-image-resizer copied to clipboard
Apply correct rotation depending on EXIF orientation code
Describe the bug On some images, the 90 degree rotation is not correctly applied (or any other rotation).
To Reproduce Steps to reproduce the behavior:
- In the example app, in function
resize
put a value of90
in rotation parameter - Build the example application;
- Select an image with a EXIF orientation code = 4 (see explanation below)
Observed behavior
original | result |
---|---|
Expected behavior
original | result |
---|---|
Platform concerned:
- Android: ✅
- iOS: ✅
Details
Current behavior
Before applying any transformation to the image, the library do two things:
- Load the bitmap image = a grid of dots or pixels that forms an image = raw image of the camera sensor
- Get the orientation of that image following the EXIF orientation code;
- Add the rotation if parameter is specified;
- Apply the rotation to the bitmap;
- Apply the resizing to the bitmap;
- Save the new image.
Problem
We do not handle properly all EXIF Orientation code. In the case of an Orientation code = 4 (i.e Mirror vertical), the getOrientation method returns 0, which is correct, but we do not apply a vertical flip on the bitmap before applying the desired rotation.
The EXIF Orientation code tells to the device how the image (orientation + flip) should be displayed on the screen (i.e. how the bitmap should be displayed) => more information about each value here
The following array show which EXIF orientation value are & are not properly handled with a rotation of 90°:
Proposition of algorithm
- Load the bitmap image = a grid of dots or pixels that forms an image = raw image of the camera sensor
- Get the orientation of that image following the EXIF orientation code;
- Get the flip (horizontal, vertical or none) of that image following the EXIF orientation code;
- Apply the rotation to the bitmap;
- Apply the flip to the bitmap;
- Apply the rotation if parameter is specified;
- Apply the resizing to the bitmap;
- Save the new image.