iOS UIScrollView捏缩放可添加空白

Question

I'm implementing pinch to zoom of an image using UIImageView inside a UIScrollView. The scroll view doesn't take full screen size. I made the background of the scrollview green. I then pinch-zoomed in the image.

The problem is that when I scroll the zoomed image it's not centered correctly in the scroll view and has some space to the right and bottom. If I try to scroll to the top or left the scroll view doesn't allow to scroll to the end of the image by similar amount of space. The amount of space seems to be related on how I move my fingers when doing the pinch gesture.

Here is a screenshot:

Here is my code:

// On viewWillAppear:
- (void)loadMyImage
{
    self.myImage.contentMode = UIViewContentModeScaleAspectFit;
    self.myImage.image = self.originalImage; // an UIImage loaded from gallery

    self.myImage.bounds = CGRectMake(0, 0, self.originalImage.size.width, self.originalImage.size.height);
    self.scrollView.bounds = CGRectMake(0,0,320,200);
    self.scrollView.frame = CGRectMake(0,0,320,200);
    self.scrollView.minimumZoomScale=1.0f;
    self.scrollView.maximumZoomScale=2.0f;
    self.scrollView.delegate = self;

    self.myImage.userInteractionEnabled = YES;
}

// Scroll view zooming events:
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{return self.myImage;}

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale
{
    CGSize boundsSize = self.scrollView.bounds.size;
    CGRect contentsFrame = self.myImage.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.myImage.center = CGPointMake(
        contentsFrame.origin.x + contentsFrame.size.width / 2.0f,
        contentsFrame.origin.y + contentsFrame.size.height / 2.0f);

    CGPoint offset = CGPointMake(
        self.myImage.center.x - self.scrollView.bounds.size.width / 2.0f,
        self.myImage.center.y - self.scrollView.bounds.size.height / 2.0f);

    [UIView animateWithDuration:.25 animations:^{
        [self.scrollView setContentOffset:offset];
    }];

    NSLog(@"Final state of frame: %g x %g (%g , %g) and center (%g , %g)",
          self.myImage.frame.size.width, self.myImage.frame.size.height,
          self.myImage.frame.origin.x, self.myImage.frame.origin.y,
          self.myImage.center.x, self.myImage.center.y);
    NSLog(@"offset: (%g , %g)",
          self.scrollView.contentOffset.x, self.scrollView.contentOffset.y);
    NSLog(@"Inset left %g , right %g , top %g , bottom %g",
          self.scrollView.contentInset.left,
          self.scrollView.contentInset.right,
          self.scrollView.contentInset.top,
          self.scrollView.contentInset.bottom);
    NSLog(@"==================================");
}

And here is my output:

Initial state of bounds: 320 x 200
of frame: 320 x 200 (0 , 0) and center (160 , 100)
offset: (0 , 0)
==================================
Final state of frame: 640 x 400 (0 , 0) and center (320 , 200)
offset: (160 , 100)
Inset left 0 , right 0 , top 0 , bottom 0
==================================

I tried setting automaticallyAdjustsScrollViewInsets to NO, but my view controller doesn't respond to the selector. And besides, the insets report 0-s.

Any solution or work-around would be great. Any idea or possible explanation for this behavior would also be appreciated.

Answer 1

I suggest you to use the following library in Github:

https://github.com/akhiljayaram/PJImageZoomView

Don't forget to add

self.automaticallyAdjustsScrollViewInsets = NO;

in your viewcontroller.
Hope this helps! :)