Ios – Resetting UIScrollView’s zoomScale property on autorotation

autorotateiosiphonescale

I have a custom UIViewController onto which I've added a UIImageView (on the StoryBoard) and then embedded the UIImageView in a UIScrollView. My program loads an image into the imageView and scales it to properly fit. By proper fit, I mean this:

if the aspect ratio of the image exactly matches that of the view, the image will be scaled to exactly fit the view, with no scroll bars
otherwise, the image will be scaled to exactly fit in one dimension, with a scrollbar in the other dimension.

I currently do this in viewWillAppear. Below is my code for that method and an auxiliary method that calculates the correct zoomScale:

-(float) findZoomScale {    
    float widthRatio = self.view.bounds.size.width / self.imageView.image.size.width;
    float heightRatio = self.view.bounds.size.height / self.imageView.image.size.height;
    float ratio;
    if (widthRatio > heightRatio) ratio = widthRatio;
    else ratio = heightRatio;
        return ratio;
}

- (void) viewWillAppear:(BOOL)animated {
    [super viewWillAppear:YES];
    self.imageView.image = self.image;
    self.imageView.frame = CGRectMake(0, 0, self.imageView.image.size.width, self.imageView.image.size.height);
    self.scrollView.contentSize = self.imageView.image.size;
    self.scrollView.zoomScale = [self findZoomScale];
        [self.scrollView flashScrollIndicators];
}

- (void)viewDidLoad {    
    [super viewDidLoad];
    self.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:self.photoURL]];
    self.imageView.image = self.image;
    self.imageView.frame = CGRectMake(0, 0, self.imageView.image.size.width, 
        self.imageView.image.size.height);
    self.scrollView.delegate = self;
    self.scrollView.zoomScale = 1.0;
    self.navigationItem.title = self.photoTitle;
    self.scrollView.autoresizesSubviews = YES;
    self.scrollView.autoresizingMask = (UIViewAutoresizingFlexibleBottomMargin | 
        UIViewAutoresizingFlexibleRightMargin | UIViewAutoresizingFlexibleLeftMargin | 
        UIViewAutoresizingFlexibleTopMargin | UIViewAutoresizingFlexibleWidth | 
        UIViewAutoresizingFlexibleHeight);
}

This code works as I intended for the initial load of an image, whether the iPhone is in landscape or portrait orientation. But when I then rotate the iPhone with the image already loaded, it does not properly rescale. I have tried to do the rescaling in didRotateFromInterfaceOrientation, playing with the scrollView's zoomScale property, but I can't get it to work. Is this the correct place to do the rescaling? And if so, how do I do it? Thanks.

Duane

Best Answer

I just had this exact problem (I assume you're on the CS193p assignment 4 as well), and solved it by setting the zoomScale back to 1 before adjusting the UIScrollView's contentSize upon rotation.

For example:

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
    //reset zoomScale back to 1 so that contentSize can be modified correctly
    self.scrollView.zoomScale = 1;

    // reset scrolling area equal to size of image
    self.scrollView.contentSize = self.imageView.image.size;

    //reset the image frame to the size of the image
    self.imageView.frame = CGRectMake(0, 0, self.imageView.image.size.width, self.imageView.image.size.height);

    //set the zoomScale to what we actually want
    self.scrollView.zoomScale = [self findZoomScale];
}

Related Solutions

Ios – UIImageView/UIScrollView forcing a fixed aspect ratio to fit the screen

I fixed it!

For anyone else having the same problem, here's how I fixed the code:

The Cause of the bug was that Interface Builder was forcing the views to use the ScaleToFill contentMode. Setting the ScrollView's contentMode to UIViewContentModeScaleAspectFit didn't work on its own, since the imageView was still being distorted.

The Fix:

The following code had to be added at the end of the setup for the UIScrollView and UIImageView (inside of the viewDidLoad() method):

    [imageScrollView setContentMode:UIViewContentModeScaleAspectFit];
    [imageView sizeToFit];
    [imageScrollView setContentSize:CGSizeMake(imageView.frame.size.width, imageView.frame.size.height)];

Explanation:

First, the UIScrollView's contentMode is set to AspectFit, like @Mike suggested. Then, sizeToFit() is called on the imageView to override Interface Builder's annoying presets, and to make the image the correct size.

The last line is important. You must set the contentSize for the ScrollView AFTER you re-size the imageView. Otherwise, the ScrollView will think that the image is still the size of the iPad display, and therefore won't think that there's anything to scroll. Setting the size of the ScrollView after resizing the ImageView and changing the ScrollView's contentMode makes the ScrollView the actual size of the image.

Hope that helped!

Thanks for the help Mike, it got me on the right track :)

Alex

Ios – Why is UIScrollView is resetting its zoomScale property automatically

Yeah, this happened sometime around iOS 3. zoomScale is always relative to the current state of the scrollView, not a global measurement. After each zoom, you need to recalculate the minimum and maximum zoom scales relative to the current overall zoom scale.

This is some code I've used in the past. It should give you the gist of the process:

Early on, grab the values you need:

- (void) viewDidLoad
{
    [super viewDidLoad];
    ...
    // Squirrel away min and max zoom values from nib
    sMinZoomScale = self.scrollView.minimumZoomScale; // the very minimum
    sMaxZoomScale = self.scrollView.maximumZoomScale; // the very maximum
    sGlobalZoomScale = 1.0f;  // we're currently at 100% size
    ...
}

and then the rest (self.navigationView is the scrollView's content view):

- (void) scrollViewDidEndZooming:(UIScrollView *)scrollView
                        withView:(UIView *)view
                         atScale:(CGFloat)scale
{
    // after a zoom, change the resolution of our map
    sGlobalZoomScale *= scale;
    // Peg the scale to minZoom and maxZoom, in case of rounding errors
    sGlobalZoomScale = MIN(MAX(sMinZoomScale, sGlobalZoomScale), sMaxZoomScale);
    self.navigationView.globalZoomScale = sGlobalZoomScale;
    self.navigationView.globalScaleTransform = self.globalScaleTransform;
    [self updateResolution];

    // throw out all tiles so they'll reload at the new resolution
    [self.navigationView setNeedsDisplay];
}

// By the time we get here, the scrollview's applied a fake scale and translate transform, and
//   altered the scrollview's zoom scale. BUT, the navigationview is as it ever was.
- (void) updateResolution
{
    CGFloat zoomScale = [self.scrollView zoomScale];

    CGSize oldContentViewSize = self.navigationView.frame.size;    
    // zooming properly resets contentsize as it happens.
    CGSize newContentSize = self.scrollView.contentSize;

    CGPoint newContentOffset = self.scrollView.contentOffset;
    CGFloat xMult = newContentSize.width / oldContentViewSize.width;
    CGFloat yMult = newContentSize.height / oldContentViewSize.height;

    newContentOffset.x *= xMult;
    newContentOffset.y *= yMult;

    CGFloat currentMinZoom = self.scrollView.minimumZoomScale;
    CGFloat currentMaxZoom = self.scrollView.maximumZoomScale;

    CGFloat newMinZoom = currentMinZoom / zoomScale;
    CGFloat newMaxZoom = currentMaxZoom / zoomScale;

        // Reset zoom scales temporarily so we can patch up the revised content view
    // don't call our own set..zoomScale, 'cause they eventually call this method.  Infinite recursion is uncool.  
    [self.scrollView setMinimumZoomScale:1.0f];
    [self.scrollView setMaximumZoomScale:1.0f];
    [self.scrollView setZoomScale:1.0f animated:NO];

    [self.navigationView setFrame:CGRectMake(0.0f, 0.0f, newContentSize.width, newContentSize.height)];
    [self.scrollView setContentSize:newContentSize];
    [self.scrollView setContentOffset:newContentOffset animated:NO];

    [self.scrollView setMinimumZoomScale:newMinZoom];
    [self.scrollView setMaximumZoomScale:newMaxZoom];
}

Hope this helps.

Best Answer

Related Solutions

Ios – UIImageView/UIScrollView forcing a fixed aspect ratio to fit the screen

Ios – Why is UIScrollView is resetting its zoomScale property automatically

Related Topic