iOS - 自动布局 - 在方向更改时按比例增加/减小视图大小

Posted 2023-03-15

【中文标题】iOS - 自动布局 - 在方向更改时按比例增加/减小视图大小

【英文标题】：iOS - Autolayout - Increase/Decrease view size proportionally on orientation change

【发布时间】：2015-06-05 20:54:30

【问题描述】：

我浏览了 ray wenderlich 的关于自动布局的教程 (link)，然后开始着手一个演示项目，我以为我已经弄清楚了，但我错了。如下图所示，我有一个导航栏、2 个视图和 1 个按钮。纵向模式下的布局看起来很好，没有对视图或按钮添加任何约束，并且可以理解在横向模式下视图被搞砸了。我尝试在视图上添加以下约束，但这些约束似乎不起作用。

视图#2：选择视图 2 > 编辑器 > 对齐 > 容器中的水平中心（完全隐藏视图）

将顶部空间添加到超级视图。视图再次从横向和纵向预览中消失。

如果我可以正确显示视图#2，我计划在视图#2 和视图#3 之间添加垂直空间，然后在视图#3 和按钮#4 之间添加。

我主要关心的是调整视图的大小，以便在 iPhone 4s 横向模式下显示所有视图和按钮。任何建议或建议表示赞赏。

编辑：这是我想要得到的最终结果：

【参考方案1】：

添加约束时视图消失的原因是 UIView 没有固有的内容大小，因此其大小为 0,0。没有添加约束时出现的视图是因为系统为你添加了约束，如果你不自己添加的话；系统添加的是顶部、左侧、宽度和高度。因此，您需要以某种方式设置视图的大小。你可以给它们明确的尺寸约束，你可以将它们固定到超级视图的边缘，你可以根据其他视图给它们相对高度，等等。

由于您希望 2 个视图在横向上按比例缩小，因此您应该为它们指定相对于超级视图的高度。为此，您可以选择视图和超级视图，然后从 pin 菜单中选择“Equal Heights”。编辑该约束以将乘数更改为蓝色视图的 0.25 和橙色视图的 0.2 （这假设橙色或蓝色视图是约束中的第一项 - 如果它们是第二项，那么您应该使用逆4和5的值）。您也应该对宽度执行相同的操作，因为您似乎也希望它们按比例变小。

【讨论】：

2 和 3 应该按比例缩短。我想实现这样的目标。 dropbox.com/s/7if9a22sra28eud/…

谢谢@rdelmar。我无法选择超级视图。我错过了什么吗？

@Zhr 选择你的子视图，按住“command”键，然后在场景列表中（而不是画布上）点击控制器的主视图。

谢谢，但我已经尝试过了。在这种情况下，“等高”选项被禁用。 dropbox.com/s/whw8swqm90221c3/…

@Zhr 是的，那是因为您的视图在导航栏中，所以我想您不能这样做。您的蓝色和橙色视图是否应该在导航栏中？