crop a zoomed image in ImageView inside scrollView

Question

I already do Lot of efforts from my Side. finally I need help. thanks

Goal : 1) How I fit imageView inside ScrollView

2) How I crop a zoomed Image in inside scrollView.

I have a imageView inside Scroll View. I wants crop image after zoomed which is display inside scrollview boundary. I cropped image already but it not exactly same which i wants.

Here I set backgroundColor Black to my scrollView. And when I place imageView inside it, it's not fit.

after zoom image inside scroll view is

and after crop image is

and my code is here :

- (void)viewDidLoad
{
    [super viewDidLoad];

    CGRect frame1 = CGRectMake(50,50,200,200);

    CGRect frame2 = CGRectMake(50,50,200,200);

    imageView1=[[UIImageView alloc]initWithFrame:frame1];

   imageView1.image= [UIImage imageNamed:@"back.jpeg"];

   imageView1.backgroundColor=[UIColor brownColor];

   imageView1.contentMode = UIViewContentModeScaleAspectFit;



   scroll=[[UIScrollView alloc]initWithFrame:frame2];

   scroll.backgroundColor=[UIColor blackColor];

  [scroll addSubview:imageView1];

  scroll.delegate=self;

 [self.view addSubview:scroll];

 [self setContentSizeForScrollView];

 self.imageView1.userInteractionEnabled = YES;

}

setting scroll view contentSize

-(void)setContentSizeForScrollView
{
 // scroll.contentSize = CGSizeMake(imageView1.frame.size.width,imageView1.frame.size.height);

    scroll.contentSize = CGSizeMake(200, 200);
   scroll.minimumZoomScale = .50;
  scroll.maximumZoomScale = 1.5;
}

and my crop logic is

-(IBAction)cropButtonClicked
{
    //Calculate the required area from the scrollview

CGRect rect = CGRectMake(50, 50, 200,200);


UIImage *image = [self imageByCropping:imageView1.image toRect:rect];

imageView1.image=image;


imageView1.contentMode = UIViewContentModeScaleAspectFit;


 }

And this method crop image :

- (UIImage*)imageByCropping:(UIImage *)myImage toRect:(CGRect)cropToArea{
    CGImageRef cropImageRef = CGImageCreateWithImageInRect(myImage.CGImage, cropToArea);
    UIImage* cropped = [UIImage imageWithCGImage:cropImageRef];

    CGImageRelease(cropImageRef);
    return cropped;
}

Answer 1

Answer of my own Question : After many efforts i found the answer of both of my questions.

and it work good for me. I share here, may be it help someone. :)

1) Fit image View inside Scroll View. I use this link

- (void)centerScrollViewContents {

CGSize boundsSize = scroll.bounds.size;
CGRect contentsFrame = self.imageView1.frame;

if (contentsFrame.size.width < boundsSize.width) {
contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0f;
} 
else {
contentsFrame.origin.x = 0.0f;
}

if (contentsFrame.size.height < boundsSize.height) {
    contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0f;
} 
else {
contentsFrame.origin.y = 0.0f;
}

self.imageView1.frame = contentsFrame;
}

2) Crop a zoomed Image in inside scrollView. I use this link

    UIGraphicsBeginImageContext(CGSizeMake(200, 200));

    [scroll.layer renderInContext:UIGraphicsGetCurrentContext()];

    UIImage *fullScreenshot = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    imageView1.contentMode = UIViewContentModeScaleAspectFill;

    UIImageWriteToSavedPhotosAlbum(fullScreenshot, nil, nil, nil);

    return fullScreenshot;

Answer 2

I had a similar problem recently, I got the solution using the relative idea ( Xa,b = Xa,c - Xb,c )

-(IBAction)crop:(id)sender{

        // F = frame
        // i = image
        // iv = imageview
        // sv = self.view
        // of = offset

        //Frame Image in imageView coordinates
        CGRect Fi_iv = [self frameForImage:self.image inImageViewAspectFit:self.imageView];

        //Frame ImageView in self.view coordinates
        CGRect Fiv_sv = self.imageView.frame;

        //Frame Image in self.view coordinates
        CGRect Fi_sv = CGRectMake(Fi_iv.origin.x + Fiv_sv.origin.x
                                  ,Fi_iv.origin.y + Fiv_sv.origin.y,
                                  Fi_iv.size.width, Fi_iv.size.height);
        //ScrollView offset
        CGPoint offset = self.scrollView.contentOffset;

        //Frame Image in offset coordinates
        CGRect Fi_of = CGRectMake(Fi_sv.origin.x - offset.x,
                                        Fi_sv.origin.y - offset.y,
                                        Fi_sv.size.width,
                                        Fi_sv.size.height);

        CGFloat scale = self.imageView.image.size.width/Fi_of.size.width;

        //the crop frame in image offset coordinates
        CGRect Fcrop_iof = CGRectMake((self.cropView.frame.origin.x - Fi_of.origin.x)*scale,
                                      (self.cropView.frame.origin.y - Fi_of.origin.y)*scale,
                                      self.cropView.frame.size.width*scale,
                                      self.cropView.frame.size.height*scale);

        UIImage *image = [self image:self.imageView.image cropRect:Fcrop_iof];
        // Use this crop image...

You can crop the image using:

//Use this code to crop when you have the right frame
-(UIImage*)image:(UIImage *)image cropRect:(CGRect)frame
{
    // Create a new UIImage
    CGImageRef imageRef = CGImageCreateWithImageInRect(image.CGImage, frame);
    UIImage *croppedImage = [UIImage imageWithCGImage:imageRef];
    CGImageRelease(imageRef);

    return croppedImage;
}

Since you are using the ImageView in Aspect Fit, you need to calculate the image frame inside the imageView

-(CGRect)frameForImage:(UIImage*)image inImageViewAspectFit:(UIImageView*)imageView
{
    float imageRatio = image.size.width / image.size.height;

    float viewRatio = imageView.frame.size.width / imageView.frame.size.height;

    if(imageRatio < viewRatio)
    {
        float scale = imageView.frame.size.height / image.size.height;

        float width = scale * image.size.width;

        float topLeftX = (imageView.frame.size.width - width) * 0.5;

        return CGRectMake(topLeftX, 0, width, imageView.frame.size.height);
    }
    else
    {
        float scale = imageView.frame.size.width / image.size.width;

        float height = scale * image.size.height;

        float topLeftY = (imageView.frame.size.height - height) * 0.5;

        return CGRectMake(0, topLeftY, imageView.frame.size.width, height);
    }
}

I hope this code can work for you as it worked for me.

Best,

Rafael.