iOS: renderInContext and Landscape orientation issue

Question

I'm trying to save the currently shown views on my iOS device for a certain app, and this is working properly. But I've got a problem as soon as I'm trying to save a UIImageView in Landscape orientation.

See the following image that describes my problem:

enter image description here

I'm using Auto layout for this app, and it runs on both iPhone and iPad. It seems like the ImageView is always saved as shown in portrait mode, and I'm a little bit stuck right now.

This is the code I use:

CGSize frameSize = self.view.frame.size;

if (UIInterfaceOrientationIsLandscape(self.interfaceOrientation)) {
    frameSize = CGSizeMake(self.view.frame.size.height, self.view.frame.size.width);
}

UIGraphicsBeginImageContextWithOptions(frameSize, NO, 0.0);

CGContextRef ctx = UIGraphicsGetCurrentContext();
CGFloat scale = CGRectGetWidth(self.view.frame) / CGRectGetWidth(self.view.bounds);
CGContextScaleCTM(ctx, scale, scale);

[self.view.layer renderInContext:ctx];

[self.delegate photoSaved:UIGraphicsGetImageFromCurrentImageContext()];

UIGraphicsEndImageContext();

Looking forward to your help!

What exactly is your result and what is the expected result? You swap the width and height for landscape so you should probably do some rotations as well but that will force the screenshot to be portrait. — Matic Oblak
@MaticOblak The problem is that it seems to save the image from the context in portrait mode, regardless of the current interface orientation. When you look at the pictures above, when I save the context in portrait mode everything is fine. But when I save the context in landscape mode, the image is of course shown in landscape mode, but it doesn't matter which size the context has, the image gets always saved as it would be displayed in portrait mode. Rotation doesn't change anything at this point. — chritaso

Matic Oblak Matic Oblak · Accepted Answer · 2014-07-14T10:39:26

I still have no idea what your exact issue is but using your screenshot code makes a bit strange image (not rotated or anything though, just too small). Can you try this code instead please.

+ (UIImage *)imageFromView:(UIView *)view {
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, .0f);
    [view.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage * img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return img;
}

Other then that you must understand there is a huge difference between UIImage and CGImage as the UIImage includes the orientation while CGImage does not. When dealing with image transformations it is usually with the CGImage and getting its width or height will discard the orientation. That means a CGImage will have flipped dimensions when its orientation is not up (UIImageOrientationUp). But usually when dealing with such images you create a CGImage from the context and then use [UIImage imageWithCGImage:ref scale:1.0f orientation:originalOrientation]. Only if you wish to explicitly rotate the image so it has no orientation (being UIImageOrientationUp) you need to rotate and translate the image and draw it onto the context.

Anyway, this orientation issues are quite fixed by now, UIImagePNGRepresentation respects the orientation and you have an image constructor from the CGImage already written above which is what used to be missing in the past if I remember correctly.

iOS: renderInContext and Landscape orientation issue

1 Answers