UIImage from SKTexture

Question

How to get UIImage from SKTexture?

I tried to get UIImage from SKTextureAtlas, but it seems not working too:

// p40_prop1 is a part of SKTextureAtlas
UIImage *image = [UIImage imageNamed:@"p40_prop1"];

image is nil.

Answer 1

Starting from iOS 9 it is a piece of cake. SKTexture now has CGImage property, which is of CGImageRef type. So getting image from a texture is just one line now:

let image : UIImage = UIImage(CGImage:texture.CGImage)

Answer 2

This seems to be working for me:

- (UIImage*) imageWithView:(UIView *)view
{
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0);

    [view drawViewHierarchyInRect:view.bounds afterScreenUpdates:YES];

    UIImage * img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return img;
}


- (UIImage*) imageFromNode:(SKNode*)node
{
    SKTexture*      tex     = [self.scene.view textureFromNode:node];
    SKView*         view    = [[SKView alloc]initWithFrame:CGRectMake(0, 0, tex.size.width, tex.size.height)];
    SKScene*        scene   = [SKScene sceneWithSize:tex.size];
    SKSpriteNode*   sprite  = [SKSpriteNode spriteNodeWithTexture:tex];
    sprite.position = CGPointMake( CGRectGetMidX(view.frame), CGRectGetMidY(view.frame) );
    [scene addChild:sprite];
    [view presentScene:scene];

    return [self imageWithView:view];
}

1. get the SKTexture for your node using the current SKView
2. make another SKView that is just big enough for your texture
3. add a SKSpriteNode with the texture into your new scene, placing it in the middle
4. render the view into a graphics context

Or for those who prefer Swift:

func imageWithView(view : UIView) -> UIImage {
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0)
    view.drawViewHierarchyInRect(view.bounds, afterScreenUpdates: true)
    let img = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
    return img
}

func imageFromNode(node : SKNode) -> UIImage? {
    if let tex = self.scene?.view?.textureFromNode(node) {
        let view = SKView(frame:CGRectMake(0, 0, tex.size().width, tex.size().height))
        let scene = SKScene(size: tex.size())
        let sprite  = SKSpriteNode(texture: tex)
        sprite.position = CGPoint(x: CGRectGetMidX(view.frame), y: CGRectGetMidY(view.frame))
        scene.addChild(sprite)
        view.presentScene(scene)
        return self.imageWithView(view)
    }
    return nil
}

Answer 3

There is actually a way to get a UIImage out of a SKView in iOS 7.0!

It uses regular UIView APIs to render the view into an ImageContext, then pulls a UIImage out of that. However, this solution is very limited in scope. It draws the SKView into a UIImage, then crops the resulting image to fit a given node's frame. So there must not be anything covering that node you want to snapshot. Also, both the view and scene must be visible on-screen (which is stricter than the usual -[SKView textureFromNode:] method). There may even be further restrictions that I haven't discovered.

Given all that, this procedure was still enough for what I needed, so I thought it was worth sharing.

+(UIImage *)imageFromNode:(SKNode *)node {
    SKView *view = node.scene.view;
    CGFloat scale = [UIScreen mainScreen].scale;
    CGRect nodeFrame = [node calculateAccumulatedFrame];

    // render SKView into UIImage
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, YES, 0.0);
    [view drawViewHierarchyInRect:view.bounds afterScreenUpdates:YES];
    UIImage *sceneSnapshot = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    // crop to the requested node (making sure to flip the y-coordinate)
    CGFloat originY = sceneSnapshot.size.height*scale - nodeFrame.origin.y*scale - nodeFrame.size.height*scale;   
    CGRect cropRect = CGRectMake(nodeFrame.origin.x * scale, originY, nodeFrame.size.width*scale, nodeFrame.size.height*scale);
    CGImageRef croppedSnapshot = CGImageCreateWithImageInRect(sceneSnapshot.CGImage, cropRect);
    UIImage *nodeSnapshot = [UIImage imageWithCGImage:croppedSnapshot];
    CGImageRelease(croppedSnapshot);

    return nodeSnapshot;
}

I've tested this on the simulator in 3.5" and 4" retina iPhones, retina and non-retina iPads. As for actual devices, it worked on iPhone 4S, iPhone 5S, and iPad 2, all running 7.0.4.