renderInContext does not capture rotated subviews

Question

A UIImageVIew (imageView) is added to self.view, capturing the view to album works perfectly:

 CGSize size = CGSizeMake(self.view.frame.size.height, self.view.frame.size.width);
 UIGraphicsBeginImageContext(size);
 [self.view.layer renderInContext:UIGraphicsGetCurrentContext()];
 UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
 UIGraphicsEndImageContext();
 UIImageWriteToSavedPhotosAlbum(image, self, nil, nil);

However, if the imageView subview is rotated by:

 [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];

Capturing self.view again does not reflected the rotation. The subview imageView is as if not rotated.

How to make renderInContext works with subviews rotated by CABasicAnimation?

UPDATE:

Warning: The CALayer/-renderInContext: method doesn't implement the full Core Animation composition model. The code provided below will be able to resolve most of the situations, but there are things that the CALayer/-renderInContext: method doesn't render correctly, so you may wish to contact Developer Technical Support for workaround requests.

Official Apple Technical Q&A QA1703 suggested to contact Developer Technical Support for workaround requests.

Is there a workaround already existed?

score 6 · Accepted Answer · answered Dec 11 '12 at 04:44

Use layer.presentationLayer instead of layer when renderInContext.

Here is a category for taking screenshots of UIView, UIView+Screenshot.h:

 //
 //  UIView+Screenshot.h
 //
 //  Created by Horace Ho on 2012/12/11.
 //  Copyright (c) 2012 Horace Ho. All rights reserved.
 //
 // Permission is hereby granted, free of charge, to any person obtaining a copy
 // of this software and associated documentation files (the "Software"), to deal
 // in the Software without restriction, including without limitation the rights
 // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 // copies of the Software, and to permit persons to whom the Software is
 // furnished to do so, subject to the following conditions:
 //
 // The above copyright notice and this permission notice shall be included in
 // all copies or substantial portions of the Software.
 //
 // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.

 @interface UIView (HHScreenShot)
 - (UIImage *)screenshot:(UIDeviceOrientation)orientation isOpaque:(BOOL)isOpaque usePresentationLayer:(BOOL)usePresentationLayer;
 @end

 @implementation UIView (HHScreenShot)

 - (UIImage *)screenshot:(UIDeviceOrientation)orientation isOpaque:(BOOL)isOpaque usePresentationLayer:(BOOL)usePresentationLayer
 {
     CGSize size;

     if (orientation == UIDeviceOrientationPortrait || orientation == UIDeviceOrientationPortraitUpsideDown) {
         size = CGSizeMake(self.frame.size.width, self.frame.size.height);
     } else {
         size = CGSizeMake(self.frame.size.height, self.frame.size.width);
     }

     UIGraphicsBeginImageContextWithOptions(size, isOpaque, 0.0);

     if (usePresentationLayer) {
         [self.layer.presentationLayer renderInContext:UIGraphicsGetCurrentContext()];
     } else {
         [self.layer renderInContext:UIGraphicsGetCurrentContext()];
     }

     UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

     UIGraphicsEndImageContext();

     return image;
 }

 @end

To use:

 UIImage *image = [self.view screenshot:UIDeviceOrientationPortrait
                               isOpaque:YES 
                   usePresentationLayer:YES];

score 3 · Answer 2 · answered Dec 06 '12 at 13:13

3

From the documentation:

This method renders directly from the layer tree, ignoring any animations added to the render tree.

You would have to read the rotation from the presentation layer and rotate the graphics context.

answered Dec 06 '12 at 13:13

David Rönnqvist

56,267
18
167
205

How to _rotate the graphics context_ which can be recognized by `renderInContext`? – ohho Dec 06 '12 at 14:06
`CGContextRotateCTM(context, angle)` – David Rönnqvist Dec 06 '12 at 14:11
I am looking for a higher level screen capture (like the power-home key combo screen capture). As there are many subviews insides subviews which are rotated by `CABasicAnimation` ... – ohho Dec 07 '12 at 01:38

score 2 · Answer 3 · answered Dec 10 '12 at 09:37

You should be able to use renderInContext with the presentation layer. Though this might not walk the layer hierarchy for you. So it would probably be easiest if you did either of these things:

apply the rotation to all affected sub-layers and render the root layer
write a recursive method to manually compose the presentation layers yourself

score 1 · Answer 4 · answered Dec 07 '12 at 02:05

As David said, animations are not rendered by renderInContext. Animations are applied to the presentation layer, which is display only.

The simplest thing to do would be to apply your rotation to your layer inside a CATransaction that disables implicit animations, then capture your layer.

I believe that would work. (However I haven't tried that specific thing, so I'm not positive.)

Alternately, you can set up your animations so that they are not set to stay in force once the animation completes, but instead change the underlying property right before the animation begins. Then when you render the layer, the sublayers should draw in their final positions.

Rendering an "in flight" animation would be much trickier. For that you would need to walk the layer tree, querying each layer's presentation layer, and transferring the settings you are animating to the base layer. That would screw up your layers once the animation is complete however, so you would need to save away the value of each property somehow, set it to it's "in flight" value from the presentation layer, capture your image, then set the property/properties of each layer back, all inside a CATransaction that disables animation.

I tried `CATransaction` but no luck. From the `CATransaction` doc, my understanding is the animations are already _implicitly_ committed (from user point of view, subviews are rotated, but already stayed on screen for a while). — ohho, Dec 07 '12 at 06:13

renderInContext does not capture rotated subviews

4 Answers4

Linked