如何在 Interface Builder 中实现这种布局？答案

【问题标题】：How to achieve this layout in Interface Builder?如何在 Interface Builder 中实现这种布局？
【发布时间】：2017-11-25 01:42:06
【问题描述】：

我正在使用静态表视图控制器并在 Interface Builder 中定义 UI。

我希望所有 UILabel 的宽度相同，以便 UITextField 的左侧对齐。

如果我强制设置宽度，那么它们通常会相互过度绘制。

我正在考虑根据控制器内“安全消息”的宽度以编程方式修改 UILabel 宽度，但我无法重新布局。

let width = labelSafeMessage.frame.size.width;
labelName.frame.size.width = labelSafeMessage.frame.size.width;
labelName.sizeToFit();
labelMessage.frame.size.width = labelSafeMessage.frame.size.width;
labelMessage.sizeToFit();

【问题讨论】：

标签： ios swift user-interface interface-builder

【解决方案1】：

您可以只使用 Interface Build 来做到这一点，并且您不需要强制标签具有相同的大小。您唯一需要做的就是将 UITextFields 的前导间距设置为 superview，它们将与左侧对齐。

【讨论】：

【解决方案2】：

你可以通过在tableView显示数据之前计算宽度来避免重新布局。

获取集合中最大的字符串，然后用这个

var str = "Hello, playground"
let constraintRect = CGSize(width: CGFloat.greatestFiniteMagnitude, height: DEFINED_HEIGHT)
let boundingBox = (str as? NSString)?.boundingRect(with: constraintRect, options: NSStringDrawingOptions.usesLineFragmentOrigin, attributes: [NSFontAttributeName: FONT], context: nil)
boundingBox.width //width for the labels

只需将 DEFINED_HEIGHT 替换为标签的高度，即行的高度减去保持它的顶部和底部约束。和 FONT，用于标签中使用的字体。

【讨论】：

【解决方案3】：

您可以使用垂直的UIStackView，而不是使用UITableView，它将包含UIViews。

将您的UILabels 约束设置为Align Leading edges 和Align Trailing edges，并设置Content Hugging Priority 和Content Compression Resistance Priority 以及标签不会被裁剪和正确贴合。

将UITextFields 约束设置为Align Leading edges 和Align Trailing edges，这样就可以解决问题。

【讨论】：