iphone - 将可缩放图像保持在 UIScrollView 的中心

Question

在我的 iPhone 应用程序中，我需要为用户提供在屏幕上缩放/平移大图像的功能。这非常简单:我使用 UIScrollView，设置最大/最小比例因子并按预期进行缩放/平移。这就是事情变得有趣的地方。该图像是从服务器接收的动态图像。它可以有任何维度。当图像首次加载时，它会按比例缩小(如果需要)以完全适合 UIScrollView 并在 ScrollView 中居中 - 屏幕截图如下:

由于图像的比例与 ScrollView 的比例不同，因此在图像上方和下方添加了空白，以使图像居中。然而，当我开始缩放图像时，实际图像变得足够大以填充整个 ScrollView 视口(viewport)，因此不再需要顶部/底部的白色填充，但是它们仍然存在，从这个截图中可以看出:

我相信这是因为包含图像的 UIImageView 会自动调整大小以填充整个 UIScrollView 并且在缩放时，它只会按比例增长。它的缩放模式设置为 Aspect Fit。 UIScrollView 的委托(delegate) viewForZoomingInScrollView 只是返回 ImageView 。

我试图在 scrollViewDidEndZooming 方法中重新计算并重新设置 UIScrollView、contentSize 和 ImageView 的大小:

CGSize imgViewSize = imageView.frame.size;
CGSize imageSize = imageView.image.size;

CGSize realImgSize;
if(imageSize.width / imageSize.height > imgViewSize.width / imgViewSize.height) {
    realImgSize = CGSizeMake(imgViewSize.width, imgViewSize.width / imageSize.width * imageSize.height);
}
else {
    realImgSize = CGSizeMake(imgViewSize.height / imageSize.height * imageSize.width, imgViewSize.height);
}
scrollView.contentSize = realImgSize;

CGRect fr = CGRectMake(0, 0, 0, 0);
fr.size = realImgSize;
imageView.frame = fr;

然而，这只会让事情变得更糟(边界仍然存在，但平移在垂直方向上不起作用)。

有没有什么方法可以在不需要时自动减少空白，然后在放大过程中再次增加？我怀疑这项工作需要在 scrollViewDidEndZooming 中完成，但我不太确定该代码需要是什么。

Answer 1

太棒了!

感谢代码:)

只是想我会添加到这里，因为我稍微改变了它以改善行为。

// make the change during scrollViewDidScroll instead of didEndScrolling...
-(void)scrollViewDidZoom:(UIScrollView *)scrollView
{
    CGSize imgViewSize = self.imageView.frame.size;
    CGSize imageSize = self.imageView.image.size;

    CGSize realImgSize;
    if(imageSize.width / imageSize.height > imgViewSize.width / imgViewSize.height) {
        realImgSize = CGSizeMake(imgViewSize.width, imgViewSize.width / imageSize.width * imageSize.height);
    }
    else {
        realImgSize = CGSizeMake(imgViewSize.height / imageSize.height * imageSize.width, imgViewSize.height);
    }

    CGRect fr = CGRectMake(0, 0, 0, 0);
    fr.size = realImgSize;
    self.imageView.frame = fr;

    CGSize scrSize = scrollView.frame.size;
    float offx = (scrSize.width > realImgSize.width ? (scrSize.width - realImgSize.width) / 2 : 0);
    float offy = (scrSize.height > realImgSize.height ? (scrSize.height - realImgSize.height) / 2 : 0);

    // don't animate the change.
    scrollView.contentInset = UIEdgeInsetsMake(offy, offx, offy, offx);
}