Crop Landscape Image Dynamically

Question

I want to crop Image according to red View . There are some points to keep in mind.

1.Image can be scrolled and Zoomed. 2.Red ImageView is created Dynamically according to Image

 UIImage* whole = [UIImage imageNamed:@"9.png"]; //I uses this image
 CGImageRef cgImg = CGImageCreateWithImageInRect(whole.CGImage, CGRectMake(x, y, incX, incY));
 UIImage* part = [UIImage imageWithCGImage:cgImg];

I just want to know How to find the Values of

x, y, incX, incY

Thanks...

Scenario 1: Normal (Not Scrolled)

Expected Result (Ignore Black Border On Top and Bottom)

Scenario 2:Scrolled

Expected Result (Ignore Black Border On Top and Bottom)

Scenario 3: Zoomed

And same Expected Result for the Zoomed One.

In all cases I want the respective Images Inside the Red Rectangle.

For all These I am Using this Code...

    -(void)cropClicked:(UIButton*)sender
    {
        float zoomScale = 1.0 / [mainScrollView zoomScale];
        CGRect rect;
        rect.size.width = [redImageView bounds].size.width * zoomScale ;
        rect.size.height = [redImageView bounds].size.height * zoomScale ;
        rect.origin.x = ([mainScrollView bounds].origin.x + redImageView.frame.origin.x );
        rect.origin.y = ([mainScrollView bounds].origin.y + redImageView.frame.origin.y );

        CGImageRef cr = CGImageCreateWithImageInRect([[mainImageView image] CGImage], rect);
        UIImage *cropped = [UIImage imageWithCGImage:cr];
        mainImageView.image=cropped;
        UIImageWriteToSavedPhotosAlbum(cropped, nil, nil, nil);
        CGImageRelease(cr);
    }

Answer 1

Well, as @HDdeveloper rightly said, you can use CGImageCreateWithImageInRect. This take 2 params, the first is the whole image, the second is the frame that you want to crop (so probably the frame of your red imageView).
The problem is that if you're targeting for both retina/non retina; if your whole image is an image @2x and you want to crop the image with the red imageview frame you have to double your frame to get the right screenshot.
So you can try with this method:

//Define the screen type:
#define isRetinaDisplay [[UIScreen mainScreen] respondsToSelector:@selector(displayLinkWithTarget:selector:)] && ([UIScreen mainScreen].scale == 2.0)

- (UIImage*)cropInnerImage:(CGRect)rect {
    //Take a screenshot of the whole image
    UIGraphicsBeginImageContextWithOptions(self.view.frame.size, NO, 0.0);
    [self.view.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage* ret = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    CGRect rct;
    //Double the frame if you're in retina display
    if (isRetinaDisplay) {
        rct=CGRectMake(rect.frame.origin.x*2, rect.frame.origin.y*2, rect.size.width*2, rect.size.height*2);
    } else {
        rct=rect;
    }
    //Crop the image from the screenshot
    CGImageRef imageRef = CGImageCreateWithImageInRect([ret CGImage], rct);
    UIImage *result = [UIImage imageWithCGImage:imageRef];
    CGImageRelease(imageRef);
    //Save and open the result images with Preview.app
    [UIImagePNGRepresentation(result) writeToFile: @"/tmp/testCrop.png" atomically: YES];
    system("open /tmp/testCrop.png");
    [UIImagePNGRepresentation(ret) writeToFile: @"/tmp/testRet.png" atomically: YES];
    system("open /tmp/testRet.png");
    //
    return result;
}

Where the rect parameter must be your red image frame, and self.view.frame must be the equal to the wholeImageView.frame. You can skip the last 4 lines, these are just to see in your Mac what you're cropping.

PS: i use this method to crop an image and set it as background of UIView, this is the reason i have to double the frame.

Answer 2

You can use CGImageRef pass your rect in the whole image. Then call this on button click

UIImage* whole = [UIImage imageNamed:@"9.png"]; //I uses this image
    CGImageRef cgImg = CGImageCreateWithImageInRect(whole.CGImage, CGRectMake(x, y, incX, incY));
    UIImage* part = [UIImage imageWithCGImage:cgImg];