Ever wanted to have an image view in a scrollview? Sure, you could directly add it using code, but wouldn’t it be nice to do it in Interface Builder?
If you’re like me, you like to leave on the defaults unless absolutely necessary. I had an issue where I added an image view to the scroll view in Interface Builder.
The image view then had an image added to in code. I resized the content view of the scroll view in code to be the same size as the image view (which you have to do
in order to get it to scroll).
Unfortunately, when an image larger than the scrollview was used, it went off the top of the scroll view by about 30px. I thought its origin was using the main view,
instead of the scroll view’s frame, but after modifying various properties I had no luck – and strange results, with the image always returning to about 30px higher than
the scroll view content area.
After trying to resolve things programattically, I resorted to Interface Builder again. I tried any number of properties on the scroll view to get its content
placed at its origin. It turns out that, by default, a UIImageView has a default “Mode” of center. That affects its alignment in its parent view. This ain’t
HTML kids, it is the elements themselves who decide how they are aligned in their parent elements. So, I just change the “Mode” to “Top Left”, and Robert’s your mother’s
The code for getting the scroll view to scroll (just FYI) is included below. If thisImage is bigger than the scroll view in any dimension, it will let you scroll
in the corresponding direction – but if it’s the same size or smaller, no scrolling is possible in that direction. Pretty nice. self.scrollView, by the way, has
only the default Interface Builder properties.
CGImageRef imageRef = thisImage.CGImage;
CGFloat width = CGImageGetWidth(imageRef);
CGFloat height = CGImageGetHeight(imageRef);
[self.scrollView setContentSize:CGSizeMake(width, height)];