UIScrollview with multiple images and pinch to zoom

Question

I am trying to duplicate the Photos app on the iPhone. Meaning, a scrollview with multiple images, and each image can be pinched to zoom in/out.

The Apple ScrollViewSuite example code only deals with 1 image inside of a scrollview. I have found that with multiple images, scrolling through the images becomes unpredictable. Also, the view becomes uncentered after pinching to zoom.

I have found this on Stack Overflow: Zoom UIScrollView with multiple images

However, what am I supposed to write in the scrollview delegate functions?

mikemike396 mikemike396 · Accepted Answer · 2013-01-05T17:26:10

This is what I found to work. Supports multiple images with paging and zooming. Enjoy!

#define VIEW_FOR_ZOOM_TAG (1)

@implementation SVViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    UIScrollView *mainScrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
    mainScrollView.pagingEnabled = YES;
    mainScrollView.showsHorizontalScrollIndicator = NO;
    mainScrollView.showsVerticalScrollIndicator = NO;

    CGRect innerScrollFrame = mainScrollView.bounds;

    for (NSInteger i = 0; i < 3; i++) {
        UIImageView *imageForZooming = [[UIImageView alloc] initWithImage:[UIImage imageNamed:  
        [NSString stringWithFormat:@"page%d", i + 1]]];
        imageForZooming.tag = VIEW_FOR_ZOOM_TAG;

        UIScrollView *pageScrollView = [[UIScrollView alloc] initWithFrame:innerScrollFrame];
        pageScrollView.minimumZoomScale = 1.0f;
        pageScrollView.maximumZoomScale = 2.0f;
        pageScrollView.zoomScale = 1.0f;
        pageScrollView.contentSize = imageForZooming.bounds.size;
        pageScrollView.delegate = self;
        pageScrollView.showsHorizontalScrollIndicator = NO;
        pageScrollView.showsVerticalScrollIndicator = NO;
        [pageScrollView addSubview:imageForZooming];

        [mainScrollView addSubview:pageScrollView];

        if (i < 2) {
            innerScrollFrame.origin.x += innerScrollFrame.size.width;
        }
    }

    mainScrollView.contentSize = CGSizeMake(innerScrollFrame.origin.x + 
    innerScrollFrame.size.width, mainScrollView.bounds.size.height);

    [self.view addSubview:mainScrollView];
}

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {
    return [scrollView viewWithTag:VIEW_FOR_ZOOM_TAG];
}

- (NSUInteger)supportedInterfaceOrientations {
    return UIInterfaceOrientationMaskPortrait;
} 

- (BOOL)shouldAutorotate {
    return NO;
}

@end

UIScrollview with multiple images and pinch to zoom

1 Answers