Camera Capture sample not taking orientation into account on iPad

192
1
04-18-2018 02:25 AM
TiagoRIBEIRO3
New Contributor

Hello everyone,

I'm having a problems using the camera in the iPad. For some reason it doesn't respect the orientation of the device and by default it sets the orientation always to 0, meaning it only works properly taking the photo in landscape mode but only when turning in the counter-clockwise position (so volume buttons on top).

Also looking at the orientation property of both the Camera and VideoOutput object, the camera is always at 270 no matter what but the VideoOutput changes when I change the orientation of the iPad.

On Android I don't have any issue.

I tried to manually setting the exif data of the photo taken but to no avail.

Any ideas in how to force the camera or the picture to take the correct orientation?

Thank you!

0 Kudos
1 Reply
LiweiGao
New Contributor II

Hi,

To fix the image rotation issue, you may need two components: ExifInfo and ImageObject. In general, ExifInfo helps you to get and set EXIF data of the image and ImageObject helps you to `edit` image. You can get more information about these two components in the documentation.

The basic idea is very simple. The issue occurred because the image has wrong orientation. So the only thing we need to do is to rotate it back. The question is how many degrees we should rotate so that the image is in the right direction? You can easily get the degree from the EXIF of the image. After that, depending on the platforms, you can calculate the degree you need to rotate back. In details, following code step by step:

Step 1. defined ExifInfo and ImageObject in your code

ImageObject {
   id: imageObject
}

ExifInfo {
   id: exifInfo
}

Step 2. use the ExifInfo get the how many degrees you have rotated the image

exifInfo.load(path);

var o = exifInfo.imageValue(ExifInfo.ImageOrientation);
var exifOrientation = o ? o : 1;

var exifOrientationAngle = 0;       // this is want we want
switch (exifOrientation) {
case 3:
   exifOrientationAngle = 180;
   break;

case 6:
   exifOrientationAngle = 270;
   break;

case 8:
   exifOrientationAngle = 90;
   break;
}

Step 3. based on the platforms, calculate the degree you need to rotate the image back to fix the orientation

var rotateFix = 0;             // this is want we want

switch (Qt.platform.os)
{
case "android":
   rotateFix = -exifOrientationAngle;   // exifOrientationAngle comes from step2
   break;

case "ios":
   rotateFix = -videoOutput.orientation;

   if (camera.position === Camera.FrontFace && isPortrait) {
      rotateFix = (-videoOutput.orientation + 180) % 360;
   }
   break;

default:
   rotateFix = -videoOutput.orientation;
   break;
}

Step 4. use the ImageObject to rotate the image file and save it back to the original image

if (rotateFix !== 0) {
   imageObject.load(path);               //load image into imageObject
   imageObject.rotate(rotateFix);      // fix the rotation
   imageObject.save(path);            // save the image data back to the image file, remember this will remove the exifinfo
}

Hope this would help!

0 Kudos