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

时间:2013-01-14 19:58:52

标签: ios xcode interface-builder autolayout

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

在视图的顶部:

  • 符合设备宽度的图像视图
  • 图像视图为方形(高度也等于设备宽度)

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

  • 3个高度相等的按钮
  • 他们一起填补了顶部广场下面的其余空间

这可以仅在IB中完成吗?

-Scott

2 个答案:

答案 0 :(得分:4)

不可以,因为您无法在界面构建器中表达关系约束。

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

在运行时,如果你在iPad上运行(我认为要求是在iPad和iPhone之间工作而不是肖像和风景,因为你的描述对于风景没有意义)然后删除这个约束并添加一个新的一个固定图像视图的高度与其宽度相同。

以下是如何设置其余约束。我假设你是从一个只包含其主视图插座的视图控制器开始的。

  1. 在图片视图中拖动,默认情况下会填满整个屏幕。
  2. 使用固定菜单将图像视图的高度固定为320(然后编辑创建的约束)。这是您创建插座的约束。
  3. 拖动三个按钮
  4. 全部选择它们并平均高度
  5. 选择底部按钮,然后使用“固定”菜单将底部空间固定到超级视图
  6. 选择该约束并勾选“标准”复选框。这将增加您的三个按钮以填充剩余空间(加上一点间距)。
  7. 选择所有三个按钮并均匀地固定宽度
  8. 选择一个按钮并将尾随空格固定到超级视图。和以前一样,选择此约束并勾选“标准”复选框。按钮将增长以填充视图的宽度。
  9. 您希望它看起来像这样:enter image description here

    出于某种原因,IB添加了一个按钮,并且不允许我删除其中一个按钮的高度限制。看起来似乎并不高兴拥有相同高度的三个按钮,并根据图像视图的间距和高度在运行时导出每个按钮的高度。可能还需要在运行时删除该约束,或者我可能在将这些约束在一起时遗漏了某些内容。无论如何,希望上面列出的原则是有帮助的。

答案 1 :(得分:0)

要使UIImageView平方,你需要通过代码来制定约束。我认为IB中可以涵盖所有其他要求,但就个人而言,我建议您通过编码来实现。

祝你好运。