Rendering any UIViews into UIImage in one line (updated with iOS 7 support)

Looks like you'd like to make some snapshots of your application, or maybe capturing partial UI elements on the screen for caching or saving? You can achieve this in just one single line like this.

UIImage *viewSnapshot = [myView toImage];

Add this UIView+JTViewToImage category to your project, and you'll also needed to link <QuartzCore/QuartzCore.h> framework too.

/*
 * This file is part of the http://ioscodesnippet.com
 * http://ioscodesnippet.com/2011/08/25/rendering-any-uiviews-into-uiimage-in-one-line/
 *
 * (c) Jamz Tang <jamz@jamztang.com>
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 */

#import <UIKit/UIKit.h>

@interface UIView (JTViewToImage)

// - [UIImage toImage]
//
// Follow device screen scaling. If your view is sized 320 * 480, 
// it renders 320 * 480 on non-retina display devices, 
// and 640 * 960 on retina display devices
// Use this option for making high resolution view elements snapshots to display on retina devices
- (UIImage *)toImage;

// - [UIImage toImageWithScale]
//
// Force rendering in a given scale. Commonly used will be "1".
// Good for output or saving a static image with the exact size of the view element.
- (UIImage *)toImageWithScale:(CGFloat)scale;

// - [UIImage toImageWithScale:legacy:]
//
// Set legacy to YES to force use the old API instead of
// iOS 7's drawViewHierarchyInRect:afterScreenUpdates: API
- (UIImage *)toImageWithScale:(CGFloat)scale legacy:(BOOL)legacy;

@end

/*
 * This file is part of the http://ioscodesnippet.com
 * http://ioscodesnippet.com/2011/08/25/rendering-any-uiviews-into-uiimage-in-one-line/
 *
 * (c) Jamz Tang <jamz@jamztang.com>
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 */

#import "UIView-JTViewToImage.h"
#import <QuartzCore/QuartzCore.h>

@implementation UIView (JTViewToImage)

static BOOL _supportDrawViewHierarchyInRect;

+ (void)load {
    if ([self instancesRespondToSelector:@selector(drawViewHierarchyInRect:afterScreenUpdates:)]) {
        _supportDrawViewHierarchyInRect = YES;
    } else {
        _supportDrawViewHierarchyInRect = NO;
    }
}

- (UIImage *)toImage {
    return [self toImageWithScale:0];
}

- (UIImage *)toImageWithScale:(CGFloat)scale {
    UIImage *copied = [self toImageWithScale:scale legacy:NO];
    return copied;
}

- (UIImage *)toImageWithScale:(CGFloat)scale legacy:(BOOL)legacy {
    // If scale is 0, it'll follows the screen scale for creating the bounds
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, NO, scale);

    if (legacy || ! _supportDrawViewHierarchyInRect) {
        // - [CALayer renderInContext:] also renders subviews
        [self.layer renderInContext:UIGraphicsGetCurrentContext()];
    } else {
        [self drawViewHierarchyInRect:self.bounds
                   afterScreenUpdates:YES];
    }

    // Get the image out of the context
    UIImage *copied = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    // Return the result
    return copied;
}

@end

In advance, if you want to make sure you've the exact size of the static image output, try this line instead.

UIImage *viewSnapshot = [myView toImageWithScale:1];

This will tell your app to ignore the screen scale and simply reference to the size of the view bounds.

Updated: 2013-10-14

With iOS 7 faster API, the screen capturing method is about 1.8x faster on my iPhone 5. Actual time elasped was down from 0.09s to 0.05 seconds. Clone the repository to test it in action.

Installation

Using CocoaPods: [?]
pod 'UIView-JTViewToImage', '~> 0.1'

Clone this repository:
git clone https://github.com/ioscodesnippet/UIView-JTViewToImage.git UIView-JTViewToImage

Download | More...

If you think this is useful, share this article with your friends :)