UITableViewCell 无法将标签约束到右边缘

Question

我已将UITableViewCell 子类化（带有 xib），并且我注意到当我使用自动布局/约束时，我放置在 Interface Builder 中的标签在运行时无法正确显示。

首先，我将三个标签相对于单元格的内容视图左、中、右对齐。

当我运行我的应用程序时，最左边的标签在左边，中间的标签在右边，最右边的标签看不到。

我在-tableView:cellForRowAtIndexPath:（在承载表格视图的UIViewController 子类中）记录了单元格内容视图的框架，我得到了这个值：

(0.0, 0.0, 600.0, 43.5)

据报道宽度为 600，但我认为这是通用的“任何设备”故事板大小（尽管奇怪的是，单元来自单独的 xib，只有单元视图，而不是故事板或 xib视图控制器的），并且在传递给它后将由表视图相应地调整大小（作为旁注，请注意高度为 43.5，不是 44！ )。

我尝试了几件事，发现如下：

1. 如果我在标签上针对单元格的前导（左）、顶部和底部边缘设置约束，它会正确显示。
2. 如果我将标签放置在 Interface Builder 中单元格的最右侧边缘，没有任何限制，它会显示我放置它的位置（当然，在旋转到横向时，它会与左边缘保持固定距离，而不是紧贴右边缘）。
3. 如果我将标签放置在任何地方，并向容器的后（右）边缘添加约束，它是否显示取决于约束指定的距离。也就是说，约束似乎被固定在单元格的原始右边缘 +600 上。如果我将它放在最左边的边缘附近，但将约束拖到后沿，它会出现在右边的某个地方。

我尝试从单元格的代码中记录标签的框架，如下所示：

override func layoutSubviews()
{
    super.layoutSubviews()

    // (...label should be at the right position now?)

    println("Label frame: \(rightLabel.frame)") 
}

在 Interface Builder 上，标签为 41 x 21，位于 (271, 11) 处。 上面的日志在一行中被调用两次，并给出：

Label frame: (271.0, 11.0, 41.0, 21.0)
Label frame: (544.0, 11.0, 41.0, 21.0)

相反，如果我删除尾随约束并将其替换为内容视图左边缘的前导约束，并将标签留在 Interface Builder 中的相同位置，则上述日志给出：

Label frame: (271.0, 11.0, 41.0, 21.0)
Label frame: (278.0, 11.0, 41.0, 21.0)

那么，表格视图单元格上的尾随约束是怎么回事？如何将标签与右边缘对齐？？

编辑：我将以下行添加到单元格的 layoutSubviews() 方法中：

println("Own frame: \(self.frame)")

我得到这个输出：

Label frame: (271.0, 11.0, 41.0, 21.0)
Own frame: (0.0, 0.0, 600.0, 44.0)
Label frame: (544.0, 11.0, 41.0, 21.0)
Own frame: (0.0, 0.0, 600.0, 44.0)

因此，单元格保持在 600 磅宽，即使在放入表格视图之后！

编辑 2： 所以，我发现了问题，显然它在其他地方：表格本身卡在 600 点宽，因为我没有将它限制在 Interface Builder 中的视图控制器的视图边缘。

真傻！

一旦我将表格视图的四个边缘固定到其父视图的边缘，问题就会自行解决。

第一次在 Interface Builder 中使用表格视图...

Answer 1

首先从这三个标签中删除所有约束，然后按照此步骤逐个添加约束，如下所述。

1. 对于左标签选择您的标签，转到 pin 菜单并为其添加这 5 个约束。：

1. 为中心标签添加这两个约束，使其始终出现在中心：

1. 对于右标签添加这 5 个约束：

结果将适用于所有屏幕：

HERE 是示例项目。

Answer 2

将此约束应用于您的标签

左标签的约束 1. 引导到superview 2. 顶到superview 3. 修复高宽

中心标签的约束 1.水平到superview 2. 顶到superview 3. 修复高宽

右标签的约束 1. 追踪到superview 2. 顶到superview 3. 修复高宽