如何防止 Storyboard 调整(拉伸)以 UIView 为中心的 UIImage 的大小?

How to prevent Storyboard from resizing (stretching) a UIImage centered on a UIView?

我有一个通用 iOS 应用程序,我正在尝试将故事板启动屏幕上的旧式启动图像转换为简单的居中图像,因此我有一个适用于所有设备的故事板。当应用程序在尺寸大于图像的设备上 运行 时,我的图像(640x1136,iPhone 5s 大小)不需要拉伸——换句话说,UIView 的背景颜色应该出现在周围较大设备上的图像。出于调试目的,我将视图背景颜色更改为艳丽的石灰色。

我根据投票最高的答案(Suragch 的)按照 SO post here 中的指示在 UIImageView 上定义了 2 个约束,实际上还必须遵循接受的答案的建议来添加额外的 UIView,我的UIImageView 将被包含。

UIImageView 的 "content mode" 是居中的,所以看起来应该没有拉伸。

在图片中注意 Xcode 的 UIImageView 的 Size Inspector 设置。 UIView 有 iPhone 7 尺寸的暗淡(750x1334),所以因为 iPhone 比我的图像高,UIImageView 的位置使其 X 为 55,Y 为 99。宽度和高度相同作为图像本身 (640x1136)。

当我在模拟器中 运行 一个 iPhone 7 时,它看起来应该与 Xcode 的 Interface Builder 显示的完全一样(图像周围出现青柠色,但相反,对于任何大于 iPhone 5s 或 SE 的设备,它看起来就像我附上的图片(iPad Air,仅供参考)。你可以看出图像必须垂直拉伸很多,因为图片只有1136高

我附上了 iPhone 7(模拟器)iPad Air 和 iPad Pro 的屏幕截图。请注意,iPad Air 的左右边缘出现了水平的青柠色条带。请注意,对于 iPad Pro,石灰背景色开始显示在图像 上方 上方。就好像在较小的设备上,系统正在拉伸 UIImageView,但随着设备屏幕尺寸的增加,这种情况最终会停止,直到对于最大的设备(Pro),你才能真正看到周围的背景。似乎所有 设备 高于iPhone 5s 或SE,应该没有stretching/distortion。这就是我想要完成的。

Interface Builder 大小设置 iPhone 7(模拟器)截图 iPad Air(设备)截图 iPad Pro(设备)截图

尝试向您的 ImageView 添加 width/height 约束:

这是通过首先选择您的 ImageView 然后选择这个 |-☐-| 来完成的图标(位于 Storyboard window 的右下角,在您可以更改设备类型的选项旁边)

好的,我想我已经找到问题所在了。您的图像尺寸过大。你说你想要它的大小是 iPhone 5,它的 display 大小是 1136x640 像素。这与Xcode中的width/height相同。为此,将设备更改为 iPhone 5(或类似值)并获取大小。例如,View 对于 iPhone 8 的大小是 667x375。这样你的图像就不会被截断了。

通过完全 消除约束并仅使用在您选择“大小检查器”时找到的自动调整大小设置,我最终能够使它工作。 UIImageView 现在保留其指定大小并且未拉伸。