Question

I have a demo app here https://github.com/rdetert/image-transform-test

After importing an image, you can pinch, zoom, rotate the image. What I want to do is save out a 640x480 image (landscape mode) that looks identical to the live preview. So if there are 100px bars of empty space on the sides, I need the same empty bars in the final output (scaled appropriately).

This is proving to be more difficult than I thought it would be. I can’t quite get it to come out right after days of working on it.

The magic method that generates the final image is called -(void)generateFinalImage

Good luck! 😉

EDIT

The green rectangle represents the actual area the imported image can be pinched, zoomed and rotated. The resolution on the iPhone 4S is 852×640, for example.

The blue rectangle is just a live preview for debugging and it’s aspect ratio is the same as 640×480. The live preview could get very slow due to Core Image being very slow.

What I want to do is convert whatever is in the green rectangle to a 640x480 image. Notice the 852x640 is a slightly different aspect ratio than 640x480 too, but that isn’t a huge problem.

Answer 1

Is your goal is to obtain just the exact copy of what you are editing, but with the size of the original image?
I guess it could be obtained by something like this:

- (UIImage *)padImage:(UIImage *)img to:(CGSize)size
{
    if (size.width < img.size.width && size.height < img.size.height) return img;

    size.width = MAX(size.width, img.size.width);
    size.height = MAX(size.height, img.size.height);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef context = CGBitmapContextCreate(NULL, size.width, size.height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast);

    CGRect centeredRect = CGRectMake((size.width - img.size.width)/2.0, (size.height - img.size.height)/2.0, img.size.width, img.size.height);
    CGContextDrawImage(context, centeredRect, [img CGImage]);

    CGImageRef imageRef = CGBitmapContextCreateImage(context);

    CGColorSpaceRelease(colorSpace);
    CGContextRelease(context);

    UIImage *paddedImage = [UIImage imageWithCGImage:imageRef];
    CGImageRelease(imageRef);
    return paddedImage;
}

// final image size must be 640x480
- (void)generateFinalImage
{
    float rotatableCanvasWidth = 495.0;
    float rotatableCanvasHeight = 320.0;
    UIImage *tmp = self.importedRawImage;

    CGSize size = self.importedRawImage.size;
    NSLog(NSStringFromCGSize(size));

    tmp = [self padImage:tmp to:CGSizeMake(rotatableCanvasWidth, rotatableCanvasHeight)];
    CIImage *ciImage = [[CIImage alloc] initWithImage:[tmp imageWithTransform:self.importedImageView.transform]];

    CGPoint center = CGPointMake(size.width / 2.0, size.height / 2.0);

    CIContext *context = [CIContext contextWithOptions:nil];
    CGRect r = ciImage.extent;
    r.origin.x = (r.size.width - rotatableCanvasHeight) / 2.0;
    r.origin.y = (r.size.height - rotatableCanvasWidth) / 2.0;
    r.size.width = rotatableCanvasHeight;
    r.size.height = rotatableCanvasWidth;
    self.finalImage = [UIImage imageWithCGImage:[context createCGImage:ciImage fromRect:r] scale:1.0 orientation:UIImageOrientationUp];

    self.finalImage = [self.finalImage resizedImage:CGSizeMake(100.0f, 134.0f) interpolationQuality:kCGInterpolationHigh];

    self.previewImageView.image = self.finalImage;
}