iOS UIScrollView - after zoom inner content auto moves to top left corner of UIScrollView

[springframework]

I am trying to do a zoom in, just a basic one for some lines and labels inside a UIView.

it works good but the problem im having now is when you zoom in or out. right after you zoom ... the inner content scrolls to have its top left corner at the (0,0) position of the UISCrollView.

I need to have this stopped, unless the zoom in makes the inner content outside of the allowable scroll area.

 

[Taum]

Hum, I'm also using a UIScrollView and it works ok. Are you doing anything special in viewForScrolling or didEndZooming ?

 

[springframework]

can u post your code?

 

[springframework]

here is the code im using. (innerview is a class variable that holds stuff like labels/images/lines ...) innerview is what should be zoomed/panned.

	//set up the scroll view for the editable content screen
	CGRect aframe = CGRectMake(0, 40, 320, 100);
	UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:aframe];
	scrollView.contentSize = CGSizeMake(600, 200);
	scrollView.backgroundColor = [UIColor clearColor];
	scrollView.maximumZoomScale = 2;
	scrollView.minimumZoomScale = 0.25;
	scrollView.scrollEnabled = YES;
	scrollView.scrollsToTop = NO;
	scrollView.autoresizingMask = UIViewAutoresizingFlexibleHeight;
	scrollView.delegate = self;
	[scrollView addSubview:innerview];
	[window addSubview:scrollView];

these aree my delegates

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
	NSLog(@"- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{");
	return innerview;
}

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale {
	NSLog(@"- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale %@, %@, %f", scrollView, view, scale);
	//properly sets the scrolling bounds.
	scrollView.contentSize = CGSizeMake(600*scale, 5*24*scale);
}

so ... why isnt this working?

this is a simple test application and so i did everything inside the appdelegate class, could that affect things?

 

[springframework]

ok i figured out what was wrong.

i was doing this:

innerview = [[UIView alloc] initWithFrame:CGRectZero];

is seems the frame needs to have its bounds set.

 

[iphoneSDKrules]

hi, i've got the same problem, allthough i defined the contentView's frame like this:

scrollView.m:

- (id)initWithFrame:(CGRect)frame 
{
	if (self = [super initWithFrame:frame]) 
	{
		contentView = [[UIView alloc] initWithFrame:frame];
		
		//content image
		UIImage* bg = [UIImage imageNamed:@"map_bg.png"];
		UIImageView* bgView = [[UIImageView alloc] initWithImage:bg];
		[contentView addSubview:bgView];
		[bgView release];
		[bg release];
    }
}

which is called by the scrollView's controller like that:

CGRect applicationFrame = [self.view bounds];
mapImageView* mapImage= [[mapImageView alloc] initWithFrame:applicationFrame];

the rest of the code is quite identical to yours. anyway, the displayed content always moves to the upper left corner of the contentView after zooming events.

if i log the framesize using NSLog i get the correct result of 300x480
could it be a problem, that the contentView's frame resizes on zooming events? if i zoom out for example, the frame changes to 203x324

how can i stop the view moving to the upper left corner and make it stay on the same place?

 

[springframework]

you would have to post more code.

your code that you posted doesn't even have the word UIScrollView in it.

I would have to see it all to help you out.

 

[iphoneSDKrules]

ok, here's the my code, would be great if you could help me!
for detail: i'm planning to show an image of a map, which the user should be able to scroll AND zoom properly.

mapImageView.h:

#import <UIKit/UIKit.h>

@interface mapImageView : UIScrollView <UIScrollViewDelegate>
{
	UIView* contentView;
}

@property(nonatomic, retain) UIView* contentView;

@end

mapImageView.m:

#import "mapImageView.h"

@implementation mapImageView

#define MAPWIDTH 1688
#define MAPHEIGHT 1125

@synthesize contentView;

- (id)initWithFrame:(CGRect)frame 
{
	if (self = [super initWithFrame:frame]) 
	{
		contentView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)];
		
		//background imageLayer mountains
		UIImage* bg = [UIImage imageNamed:@"map_bg.png"];
		UIImageView* bgView = [[UIImageView alloc] initWithImage:bg];
		[contentView addSubview:bgView];
		[bgView release];
		[bg release];	
		[self addSubview:contentView];
			
		self.contentSize = CGSizeMake(MAPWIDTH, MAPHEIGHT);
		self.scrollEnabled = TRUE;
		self.bounces = FALSE;
		//self.scrollIndicatorInsets = UIEdgeInsetsMake(50, 0, 0, 0);
		self.bouncesZoom = FALSE;
		self.minimumZoomScale = 0.285;
		self.maximumZoomScale = 1.0;
		self.delegate = self;
		[self scrollRectToVisible:CGRectMake(250, 0, 480, 100) animated:NO];
	}
	return self;
}

- (UIView*)viewForZoomingInScrollView:(UIScrollView*)scrollView
{
    return contentView;
}

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale 
{
    //set the scrolling bounds
    self.contentSize = CGSizeMake(MAPWIDTH*scale, MAPHEIGHT*scale);
	NSLog(@"scale: %f", scale);
	NSLog(@"content width: %f", self.contentSize.width);
	NSLog(@"content height: %f", self.contentSize.height);
	NSLog(@"frame width %f", contentView.frame.size.width);
	NSLog(@"frame height %f", contentView.frame.size.height);
}

- (void)dealloc 
{
	[contentView release];
	[super dealloc];
}

@end

mapImageViewController.m:

#import "mapImageViewController.h"
#import "mapImageView.h"

@implementation mapImageViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil 
{
	if (self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil]) 
	{
		CGRect applicationFrame = CGRectMake(0, 0, 480, 300);
		mapImageView* mapImage= [[mapImageView alloc] initWithFrame:applicationFrame];
		self.view = mapImage;
	}
	return self;
}

@end

maybe you can tell me, how to make the uiscrollview "remember" its position after zooming operations...

 

[Taum]

I think you're doing it the other way round : you actually want an image to be zoomed-out. Not sure if that is even supported by UIScrollView.

Also, you set the contentView to be of size frame.size, but then tell the scroll view that your contentView has a size of MAPWIDTH * MAPHEIGHT. I think you should set your contentView's frame to be 0,0,MAPWIDTH,MAPHEIGHT. Changing the contentSize in scrollViewDidEndZooming:withView:atScale: is also a bad idea, AFAIK.

The problem with your setup is that the map will appear "zoomed-in" by default, and as far as I can tell there is no way to programmatically set the zoom level of a scroll view (but I might have missed something, as this is clearly something one might want to do so it's hard to believe Apple forgot it ... ).

 

[iphoneSDKrules]

thank you!! that works! i set the UIScrollView's framesize to MAPWIDTHxMAPHEIGHT and now it's no longer scrolling to the upper left corner!

it's true that my image is initially shown at the highest zoom level (that's where map interaction mainly happens) and the user is able to zoom out just to get an overview of the context.
the other way round, it would be more logic, but with a zoom level > 1 the bitmap pixels are visible quite clearly...
unfortunately i couldn't find a possibility for setting the zoom level programatically either