iOS 自动布局:这可以用 IB 完成吗?

Posted

技术标签:

【中文标题】iOS 自动布局:这可以用 IB 完成吗?【英文标题】:iOS Auto Layout: Can this be done with IB? 【发布时间】:2013-01-14 19:58:51 【问题描述】:

我正在尝试使用界面生成器创建以下自动布局:

在视图的顶部:

适合设备宽度的图像视图 图像视图是方形的(高度也等于设备的宽度)

填充图像视图下方的其余空间:

3 个等高按钮 它们一起填充了顶部正方形下方的其余空间

这可以仅在 IB 中完成吗?

-斯科特

【问题讨论】:

【参考方案1】:

不,它不能,因为您无法在界面生成器中表达关系约束。

除了图像视图的高度之外,您可以执行其他所有操作(几乎,请参见编辑)。您可以在视图上设置一个恒定的高度约束(可能设置为 iPhone 屏幕的宽度),然后为其创建一个出口。

在运行时,如果您在 iPad 上运行(我假设要求是在 iPad 和 iPhone 之间工作,而不是在纵向和横向之间工作,因为您的描述对横向没有意义)然后删除此约束并添加新的固定图像视图的高度与其宽度相同。

以下是设置其余约束的方法。我假设您从一个仅包含其主视图出口的视图控制器开始。

    在图像视图中拖动,默认填满屏幕。 使用固定菜单将图像视图的高度固定为 320(然后编辑创建的约束)。这是您创建出口的约束。 拖入三个按钮 全部选择它们并且引脚高度相同 选择底部按钮,然后使用“固定”菜单将底部空间固定到超级视图 选择该约束并勾选“标准”复选框。这将增大您的三个按钮以填充剩余空间(加上一点间距)。 选择所有三个按钮并固定宽度 选择一个按钮并将尾随空格固定到超级视图。和以前一样,选择此约束并勾选“标准”复选框。按钮将增长以填充视图的宽度。

您希望它看起来像这样:

出于某种原因,IB 在其中一个按钮上添加了高度限制,但不允许我删除。让三个按钮高度相等,并在运行时根据图像视图的间距和高度推导出每个按钮的高度似乎并不令人愉快。可能还需要在运行时删除该约束,或者我可能在一起抨击时遗漏了一些东西。无论如何,希望上面概述的原则是有帮助的。

【讨论】:

谢谢。假设我在 IB 中将图像高度设置为常量并通过代码对其进行自定义。如何在 IB 中配置其余约束? 我会更新答案。我目前正在写一篇关于这个确切主题的博客文章,但它还没有完成,否则我只是指出你! 感谢 jrturton- 很棒的回答! 我写完了博文:commandshift.co.uk/blog/2013/01/18/… 可以在 xib 文件中指定“square”,但我不确定如何让 IB 添加它。但是你可以通过查看xib的源代码来做到这一点。右键单击 xib 并“作为源代码打开”。找到你想要的对象的约束部分,并从一个对象添加一个约束到它自己,宽度第一个属性“高度”和第二个属性“宽度”,然后为它组成你自己的 id,像这样: 然后切换回来就变成了“Aspect Ratio Constraint”。【参考方案2】:

要使UIImageView 平方,您需要通过代码进行约束。我认为所有其他要求都可以在 IB 中涵盖,但就个人而言,我建议您通过编码来完成。

祝你好运。

【讨论】:

以上是关于iOS 自动布局:这可以用 IB 完成吗?的主要内容,如果未能解决你的问题,请参考以下文章

ios 6自动布局约束错误

使用自动布局保持 UILabel 居中

为啥这个简单的自动布局在 IB 中崩溃了?

我在哪里可以访问 IB 自动生成的布局约束?

高度的自动布局在 iOS 8 中工作但在 iOS 7 中不工作

iOS 7 自动布局与 iOS 8 自适应布局,有区别吗?