Inconsistent handling of EXIF between Android and iOS about react-native-image-editor HOT 5 CLOSED

@MarioUnlam thanks for the information on the library and great that you have a working solution for your problem. We trying to avoid Expo since this creates some big dependencies and gave us some issues with the most recent react native version in the past. For anyone else having this problem, I think I found a solution:
Read the rotation of the image with react-native-image-size in react native:

const {width, height, rotation} = await ImageSize.getSize(uri);

If there is a rotation, flip the passed height / width and offset.x/offset.y to ImageEditor

  offset = { x: offset.x, y: offset.y };
  size = { height: size.width, width: size.height }
  const cropData = { offset, size, displaySize: size };

  const croppedImageUri = await ImageEditor.cropImage(source.uri, cropData);

from react-native-image-editor.

We ran into this same issue, thank you for your details. What library are you using to resize and remove EXIF Data? I don't think it's consistent on each platform, because our Samsung S22 (Android 12) shows this problem whereas a POCO M3 (Android 11) works with no issues. I tried to rotate the image in the Java Source using the given EXIF information, it worked, but whenever I needed to zoom in on the image it was giving me the wrong area of the image.. Here is the code I have used to get the orientation..

public  int getOrientationDegree() {
      try {
        InputStream inputStream = openBitmapInputStream();
        @SuppressLint("NewApi") final ExifInterface exifInterface = new ExifInterface(inputStream);
        final int attributeInt = exifInterface.getAttributeInt(ExifInterface.TAG_ORIENTATION, ExifInterface.ORIENTATION_UNDEFINED);
        switch (attributeInt) {
          case ExifInterface.ORIENTATION_ROTATE_90:
            return 90;
          case ExifInterface.ORIENTATION_ROTATE_180:
            return 180;
          case ExifInterface.ORIENTATION_ROTATE_270:
            return 270;
        }
      } catch (IOException e) {
        e.printStackTrace();
      }
      return 0;
    }

  public static Bitmap rotateBitmap(Bitmap bitmap, int degree) {
      if (degree == 0 || bitmap == null) {
        return bitmap;
      }

      final Matrix matrix = new Matrix();
      matrix.setRotate(degree, bitmap.getWidth() / 2, bitmap.getHeight() / 2);
      return Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
    }

from react-native-image-editor.

@joshke Some people suggested using react-native-image-resizer to create a copy of the image, without the EXIF, but in my tests this pretty much doubled the processing time of the image, which is barely acceptable. If this behavior is not consistent on each platform, that's a big problem. There's no way to tell if the image will be cropped correctly, in both cases the exif data is the same, but the library handles it differently.

from react-native-image-editor.

@joshke I ended up switching to expo-image-manipulator, which allows me to resize, crop, rotate and flip images in a single function call, and it seems to take into account the EXIF data, even in my old Android phone (which had problems with react-native-image-editor). If your project is react-native-cli, with a few steps you can turn it into a "bare expo" project, allowing you to use expo libraries without changing the way you compile. I also had to add android:largeHeap="true" to my AndroidManifest.xml for it to work, as explained here: bamlab/react-native-image-resizer#235. Hope it helps.

from react-native-image-editor.

It should be fixed in the 4.0.0 release.

from react-native-image-editor.