你不是在描述比例匹配;您正在描述方面拟合。(我已经编辑了你的问题。)子视图变得尽可能大,同时保持它的纵横比并完全适合它的父视图。
不管怎样,你可以用自动布局来做这个。你完全可以在Xcode 5.1的IB中完成。让我们从一些视图开始:
浅绿色视图的长宽比为4:1。深绿色视图的长宽比为1:4。我将设置约束,以便蓝色视图填充屏幕的上半部分,粉红色视图填充屏幕的下半部分,每个绿色视图尽可能地扩展,同时保持其纵横比并适合其容器。
首先,我将在蓝色视图的所有四个边创建约束。我将它固定到每条边上最近的邻居,距离为0。我确保关闭了页边距:
注意,我还没有更新框架。我发现在设置约束时在视图之间留出空间更容易,只需手动将常量设置为0(或任何值)。
接下来,我将粉红色视图的左、下、右边缘固定到最近的邻居。我不需要设置上边约束因为它的上边已经被约束到蓝色视图的下边。
我还需要在粉色和蓝色视图之间设置等高约束。这将使它们各自占据屏幕的一半:
如果我告诉Xcode现在更新所有的帧,我得到这个:
所以到目前为止我建立的约束条件是正确的。我撤销它并开始处理浅绿色视图。
对浅绿色视图进行方面拟合需要五个约束:
A required-priority aspect ratio constraint on the light green view. You can create this constraint in a xib or storyboard with Xcode 5.1 or later.
A required-priority constraint limiting the width of the light green view to be less than or equal to the width of its container.
A high-priority constraint setting the width of the light green view to be equal to the width of its container.
A required-priority constraint limiting the height of the light green view to be less than or equal to the height of its container.
A high-priority constraint setting the height of the light green view to be equal to the height of its container.
让我们考虑两个宽度约束。小于或等于约束本身不足以确定浅绿色视图的宽度;许多宽度将符合限制。由于存在歧义,自动布局将尝试选择一个解决方案,使其他约束(高优先级但不是必需的)中的错误最小化。最小化误差意味着使宽度尽可能接近容器的宽度,同时不违反所需的小于或等于约束。
同样的事情也发生在高度限制上。由于还需要宽高比约束,它只能沿一个轴最大化子视图的大小(除非容器恰好与子视图具有相同的宽高比)。
首先我创建纵横比约束:
然后我用容器创建等宽和等高的约束:
我需要将这些约束编辑为小于或等于约束:
接下来,我需要用容器创建另一组等宽和高的约束:
我需要让这些新的约束的优先级低于要求的优先级:
最后,你要求子视图在它的容器中居中,所以我将设置这些约束:
现在,为了测试,我将选择视图控制器并让Xcode更新所有的帧。这是我得到的结果:
哦!子视图已经扩展到完全填充它的容器。如果我选择它,我可以看到它保持了它的纵横比,但它在做一个方面填充而不是方面拟合。
问题是,在一个小于或等于的约束上,哪个视图在约束的两端很重要,而Xcode设置的约束与我的期望相反。我可以选择两个约束中的每一个,并反转其第一项和第二项。相反,我将只选择子视图并将约束更改为大于或等于:
Xcode更新布局:
现在我对底部的深绿色视图做同样的事情。我需要确保它的纵横比是1:4 (Xcode以一种奇怪的方式调整了它,因为它没有约束)。我不会再展示步骤了,因为它们是一样的。结果如下:
现在我可以在iPhone 4S模拟器中运行它,它的屏幕大小与IB使用的屏幕大小不同,并测试旋转:
我可以在iPhone 6模拟器中进行测试:
为了方便大家,我上传了我最后的故事板。