How to implement two separate UIScrollViews with nested UIImageViews...only one is zooming

Question

Ok, I have been working on solving this problem all day, and I am getting really close. I am trying to have create a way to view more than one scrollView/imageView nested pair that allows for zooming on an image.

When the view loads, there is just one scrollView that takes up the whole screen, but then when a button is pressed, I cut the width of the first scrollView in half, and unhide another (which has a nested imageView in it as well) right next to it. So there is a split view effect, and ideally the user will be able to pinch and zoom each image separately.

So I have all that working except for the separate pinch and zoom part. No matter where I pinch on the screen, only the first scrollView zooms. So even though I am touching another scrollView, it is still only affecting the first.

I have them setup in IB, and then they are setup in viewDidLoad this way:

[scrollView setBackgroundColor:[UIColor blackColor]];
[scrollView setCanCancelContentTouches:NO];
scrollView.clipsToBounds = YES;    // default is NO, we want to restrict drawing within our scrollview
scrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite;

scrollView.minimumZoomScale = 1;
scrollView.maximumZoomScale = 5;
scrollView.delegate = self;
[scrollView setScrollEnabled:YES];

imageView3 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"monitor.JPG"]];

[scrollView addSubview:imageView3];
//[scrollView setFrame:CGRectMake(0, 0, 1024, 660)];


[scrollView1 setBackgroundColor:[UIColor blackColor]];
[scrollView1 setCanCancelContentTouches:NO];
scrollView1.clipsToBounds = YES;    // default is NO, we want to restrict drawing within our scrollview
scrollView1.indicatorStyle = UIScrollViewIndicatorStyleWhite;

scrollView1.minimumZoomScale = 1;
scrollView1.maximumZoomScale = 5;
scrollView1.delegate = self;
[scrollView1 setScrollEnabled:YES];

imageView31 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"monitor.JPG"]];

[scrollView1 addSubview:imageView31];

And then I hide and unhide different scrollViews (I have 40 depending on the segmentedControl index on the toolbar. Am I headed in the right direction? Is it possible to have two separately accessible scrollViews?

Any help would be appreciated.

Thanks!

EDIT:

Ok so I went through and updated the clipToBunds bit...DUH. It definitely makes it look better, but still isn't solving the problem. Here is the code I am calling depending on the selected index:

-(void) pickedOne{


if(segment.selectedSegmentIndex == 0){

    [scrollView setFrame:CGRectMake(0, 0, 1024, 660)];
    [scrollView setContentSize:CGSizeMake(1024, 660)];
    scrollView.hidden = NO;

    scrollView1.hidden = YES;
    scrollView2.hidden = YES;
    scrollView3.hidden = YES;

}else if(segment.selectedSegmentIndex == 1){

    [scrollView setFrame:CGRectMake(0, 0, 512, 660)];
    scrollView.zoomScale = 1.0;
    scrollView.hidden = NO;


    [scrollView1 setFrame:CGRectMake(512, 0, 512, 660)];
    scrollView1.zoomScale = 1.0;
    scrollView1.hidden = NO;

            scrollView2.hidden = YES;
            scrollView3.hidden = YES;

}

Is there anything majorly wrong with that approach?

If I pinch to zoom on the right scrollView, it makes the scroll view bigger, (but doesn't increase the size of the scrollView2 image) but it DOES increase the size of the first scrollView's image when you pinch inside of EITHER scrollViews...strange

Jim Jim · Accepted Answer · 2011-03-05T00:31:38

scrollView.clipsToBounds = NO;    // default is NO, we want to restrict drawing within our scrollview

Isn't this the opposite of what you want? Setting it to YES restricts restricts drawing to within your scrollview.

It sounds to me like you aren't resizing the scrollview. Are you resizing its contents or the image view within it? Can you post the code that is called when you tap the button?

How to implement two separate UIScrollViews with nested UIImageViews...only one is zooming

1 Answers