iOS 7 自动布局 - UIScrollView 内的 UIImageView

Posted 2023-03-15

【中文标题】iOS 7 自动布局 - UIScrollView 内的 UIImageView

【英文标题】：iOS 7 Auto Layout - UIImageView inside UIScrollView

【发布时间】：2013-11-24 14:13:25

【问题描述】：

我在 ios 应用程序中有一个简单的视图，这给我带来了一些问题。

在这个视图中，我有一个 UIScrollView（主视图的全宽/高度），它固定在主视图的顶部/底部/前导/尾随（在 IB 中）。

在 UIScrollView 内部，我有一个 UIImageView，它固定在 UIScrollView 的顶部/底部/前导/尾随。

现在，UIImageView 内的图像几乎是主视图大小的两倍，因此 UIImageView 的内容模式设置为 Aspect Fit。我的问题是，当我运行项目时，图像以实际大小显示。

UIImageView 位于 UIScrollView 内部的原因是因为我希望用户能够放大图像（因此它的大小是原来的两倍）。

我还希望用户能够旋转屏幕，因为图像可能是纵向或横向格式，具体取决于他们选择在上一个视图中查看的图像。

当然，这应该很容易做到（在 IB 中也是如此），但是我终其一生都无法弄清楚。

【参考方案1】：

您还必须为 UIImageView 添加宽度和高度约束。这是由于默认情况下 UIImageView 具有从图像大小派生的内在内容大小。 以下是用于定义这些约束的代码 sn-p：

[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:imageView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:scrollView attribute:NSLayoutAttributeWidth multiplier:1.0f constant:0]];
[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:imageView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:scrollView attribute:NSLayoutAttributeHeight multiplier:1.0f constant:0]];

你甚至可以在 IB 中做到这一点。

【讨论】：

是的，我很欣赏马克，但是如果我设置了明确的宽度和高度限制（比如 320 x 480），那么当设备旋转时，图像看起来不正确（如果设备是4 英寸屏幕尺寸）。

@Nick 不对宽度和高度进行硬编码。只需设置相应的约束。查看更新的答案。

我之前在 IB 中尝试过（scrollView/imageView 等高）。它让我走到了那里，因为图像现在在纵向/横向模式下都是 imageView 中的正确宽度/高度，但是我无法放大图像。

【参考方案2】：

如果我理解您的问题，您希望在开始时缩小内容。假设您的内容与手机的纵横比不同（一个安全的假设），您可以“信箱”/“隐藏”内容，或者只缩小直到图像的高度或宽度显示在电话（在上述信箱之前）。我选择了后一种方法，并将我的最小缩放设置为任一维度的最小缩放中的较大者。

代码如下：

// configure image and scroll view for scrolling to extents of actual image
double widthScale = self.view.frame.size.width / image.size.width;
double heightScale = self.view.frame.size.height / image.size.height;
self.scrollView.minimumZoomScale = MAX(widthScale, heightScale);
self.scrollView.maximumZoomScale = MIN(1 / widthScale, 1 / heightScale) / [[UIScreen mainScreen] scale]; // scale to pixel resolution
self.scrollView.zoomScale = self.scrollView.minimumZoomScale;

假设您正在使用全屏。

如果您想要任一维度的最小值，请使用：

self.scrollView.minimumZoomScale = MIN(widthScale, heightScale);