通过故事板

Question

问题

嗨，我遇到了以下问题。我创建的标题包括三个块通过故事板。我试图让它伸展以适应所有使用autolayout的设备。 我有三张图片：

• 左角图像（左边圆边）
• 中心图片（只是一行）
• 右角图像（有右边框）

右侧角落示例：

我希望这三个图像在一个中心是一行。 结果应如下所示：

第一种解决方案

我创建了以下限制条件： 对于左侧区块：

• 宽度= 152
• 身高= 50
• 导致超级视图
• 超级视图

左图像限制：

表示中间区块：

• 身高= 50
• 向左移动图像= 0
• 导致右图= 0
• 超级视图

中间图像限制：

为正确的形象：

• 宽度= 152
• 身高= 50
• 追踪到超级视图
• 超级视图

正确的图片限制：

当我在模拟器上运行我的应用程序时，一切正常，我在所有设备上看到了良好的结果但是如果我使用这些约束，我在故事板和控制台中收到了很多警告：Unable to simultaneously satisfy constraints.

实际上是因为这个

而出现在控制台中的警告

  

  
• 向左移动图像等于0
  
• 导致右图像等于0
  

第二种解决方案

我还尝试对中间图像进行以下约束：

• 将尾随约束删除为左图像
• 向超级视图添加等于右图像宽度的前导约束

但是这个解决方案会产生更多警告

问题

是否有解决方案如何通过故事板创建此类标题，而不是将宽度设为常量并为每个屏幕宽度更新？

Answer 1

所以你需要你所写的所有约束，但是你需要添加约束来说明所有这三个图像具有相同的宽度。 例如，告诉第一个与第二个相同，第二个与第三个相同。此外，您还需要删除宽度约束。

此类错误的原因是您设置了两个项目width = 152 * 2 = 304.如果此值大于屏幕宽度，则会出现警告。

Answer 2

中间约束是错误的。他们应该是：

• middle.leading = left.trailing
• middle.trailing = right.leading