StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>There are a plenty of solutions here, but I'd risk putting here my own. It's good for two reasons: it doesn't mess zooming experience, as would do updating image view frame in progress, and also it respects original scroll view insets (say, defined in xib or storyboard for graceful handling of semi-transparent toolbars etc). </p> <p>First, define a small helper:</p> <pre><code>CGSize CGSizeWithAspectFit(CGSize containerSize, CGSize contentSize) { CGFloat containerAspect = containerSize.width / containerSize.height, contentAspect = contentSize.width / contentSize.height; CGFloat scale = containerAspect > contentAspect ? containerSize.height / contentSize.height : containerSize.width / contentSize.width; return CGSizeMake(contentSize.width * scale, contentSize.height * scale); } </code></pre> <p>To retain original insets, defined field:</p> <pre><code>UIEdgeInsets originalScrollViewInsets; </code></pre> <p>And somewhere in viewDidLoad fill it:</p> <pre><code>originalScrollViewInsets = self.scrollView.contentInset; </code></pre> <p>To place UIImageView into UIScrollView (assuming UIImage itself is in loadedImage var):</p> <pre><code>CGSize containerSize = self.scrollView.bounds.size; containerSize.height -= originalScrollViewInsets.top + originalScrollViewInsets.bottom; containerSize.width -= originalScrollViewInsets.left + originalScrollViewInsets.right; CGSize contentSize = CGSizeWithAspectFit(containerSize, loadedImage.size); UIImageView *imageView = [[UIImageView alloc] initWithFrame:(CGRect) { CGPointZero, contentSize }]; imageView.autoresizingMask = UIViewAutoresizingNone; imageView.contentMode = UIViewContentModeScaleAspectFit; imageView.image = loadedImage; [self.scrollView addSubview:imageView]; self.scrollView.contentSize = contentSize; [self centerImageViewInScrollView]; </code></pre> <p>scrollViewDidZoom: from UIScrollViewDelegate for that scroll view:</p> <pre><code>- (void)scrollViewDidZoom:(UIScrollView *)scrollView { if (scrollView == self.scrollView) { [self centerImageViewInScrollView]; } } </code></pre> <p>An finally, centering itself:</p> <pre><code>- (void)centerImageViewInScrollView { CGFloat excessiveWidth = MAX(0.0, self.scrollView.bounds.size.width - self.scrollView.contentSize.width), excessiveHeight = MAX(0.0, self.scrollView.bounds.size.height - self.scrollView.contentSize.height), insetX = excessiveWidth / 2.0, insetY = excessiveHeight / 2.0; self.scrollView.contentInset = UIEdgeInsetsMake( MAX(insetY, originalScrollViewInsets.top), MAX(insetX, originalScrollViewInsets.left), MAX(insetY, originalScrollViewInsets.bottom), MAX(insetX, originalScrollViewInsets.right) ); } </code></pre> <p>I didn't test orientation change yet (i.e. proper reaction for resizing UIScrollView itself), but fix for that should be relatively easy.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload