UIScrollView scale subviews on zoom

[Missing.Matter]

Hi all,

I'm making a board game using a UIScrollView to display the board, and I'm trying to figure out how to zoom the game pieces when I zoom in on the board with a pinch gesture.

Currently, zooming the board works, and moving the pieces works. However when I zoom in on the board, the pieces maintain their frame position and size when I zoom the board.

Is there an easy way to implement this behavior, or am I going to have to manually write a method to transform each piece's frame on a zoom gesture? If that's the case, where do I call this method from?

Here is my code as it currently stands:

#import "RootViewController.h"

#define ZOOM_VIEW_TAG 100

@implementation RootViewController

@synthesize imageScrollView;

- (void)viewDidLoad {
    [super viewDidLoad];
	
	CGRect fullScreenRect=[[UIScreen mainScreen] applicationFrame];

	//Initialize scrollview
	imageScrollView=[[UIScrollView alloc] initWithFrame:fullScreenRect];
	[imageScrollView setDelegate:self];
	
	//Initialize Board
	UIImageView *imageBoardView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Board.png"]];
	[imageBoardView setTag:ZOOM_VIEW_TAG];
	[imageScrollView setContentSize:[imageBoardView frame].size];
	[imageScrollView addSubview:imageBoardView];
	[imageBoardView release];
	
	//Initialize Tokens
	TokenImageView *tokenImageView = [[TokenImageView alloc] initWithImage:[UIImage imageNamed:@"Token.png"]];
	[tokenImageView setDelegate:self];
	[imageScrollView addSubview:token];
	[tokenImageView release];
	
	[[self view] addSubview:imageScrollView];
	
	//calculate minimum scale to perfectly fit image width, and begin at that scale
        float minimumScale = [imageScrollView frame].size.width  / [imageBoardView frame].size.width;
        [imageScrollView setMinimumZoomScale:minimumScale];
        [imageScrollView setZoomScale:minimumScale];
	
}

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

The code initializes a scrollview, adds the board, adds a token, and zooms out to fit the board. Is there some property I'm overlooking or some other trick which would accomplish my goal?

Any help is appreciated. Thanks.

[kapps11]

hmmm. well the problem is that at the end, you are only returning the background view as the zoom view, so that is why the tokens dont change at all. But im not sure if it lets you return multiple views...

[Missing.Matter]

Originally Posted by kapps11

hmmm. well the problem is that at the end, you are only returning the background view as the zoom view, so that is why the tokens dont change at all. But im not sure if it lets you return multiple views...

I figured there might be something I could do here, like setting both views to have the same tag, but that doesn't do anything.

I've found though, that adding tokenImageView to boardImageView instead of imageScrollView produces the desired effect; however, it breaks dragging the board, so if I can fix that I'm good to go.

In another application I'm using both of these while preserving zooming, but I'm not using any gesture recognizers (I'm using them here to recognize tap to zoom). Could that be the problem?

[Missing.Matter]

Okay, in viewDidLoad I've added the following lines:

	[imageScrollView setDelaysContentTouches:NO];
	[imageScrollView setCanCancelContentTouches: NO];

	

	[imageBoardView addSubview:imageTokenView];

The last one of course replacing [imageScrollView addSubView:imageTokenView];

Adding setCanCancelContentTouches and setDelaysContentTouches fixes some problems with dragging tokens. Adding one or the other is fine, but adding them both breaks scrolling (but not zooming).

Any ideas? setDelaysContentTouches:NO is not necessary, but it gets rid of the delay between touching a token, and recognizing the touch. Is there a way to set that delay to be shorter? Or am I going to have to handle scrolling with a pan gesture recognizer?

Edit: I found the combination that breaks scrolling

[imageScrollView setDelaysContentTouches:NO];
[imageScrollView setCanCancelContentTouches:NO];
[boardImageView setUserInteractionEnabled:YES];

So the entire board is responding to touches and the scroll view can't cancel out of them. setUserInteractionEnabled is necessary to interact with the tokenImageView subviews. But I don't care about touches on the board itself, just touches on the tokens. So now I need to figure out how to ignore touches on the board but not on a token.

[Missing.Matter]

Any thoughts on this?

[Paulo Khouri]

I have the same problem when I zooming the scroll's of the scrollView stops, but I'm not scrolling an image, I'm scrolling and zooming a PDF file.