Swift - 根据其内容自动布局 UILabel 高度

Question

我在为 UILabel 设置自动布局时遇到问题，希望获得这方面的帮助。

在图片中，我创建了黄色和绿色的 UILabel。

我想要实现的是根据其内容的行数动态调整黄色 UILabel 的高度，并将绿色框的顶部锚定到黄色框的底部。

目前，我的代码如下：

// Yellow UILabel
addSubview(captionLabel)
captionLabel.anchor(top: actionButtonsStackView.bottomAnchor, left: leadingAnchor, bottom: nil, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)
captionLabel.heightAnchor.constraint(greaterThanOrEqualToConstant: 0).isActive = true

// Green UILabel
addSubview(dateLabel)
dateLabel.anchor(top: captionLabel.bottomAnchor, left: leadingAnchor, bottom: bottomAnchor, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)

注意：anchor 函数设置 top、leading、bottom 和 trailing 具有各自填充的约束。

如您所见，黄色 UILabel 占用的空间比它实际需要的要多。

如果我离开绿色 UILabel 的顶部约束，黄色框实际上开始按我的预期工作：

这个代码看起来像：

// Yellow UILabel
addSubview(captionLabel)
captionLabel.anchor(top: actionButtonsStackView.bottomAnchor, left: leadingAnchor, bottom: nil, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)
captionLabel.heightAnchor.constraint(greaterThanOrEqualToConstant: 0).isActive = true

// Green UILabel
addSubview(dateLabel)
dateLabel.anchor(top: nil, left: leadingAnchor, bottom: bottomAnchor, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)

我在这里做错了什么？

---

实际上，从绿色框中删除 bottomAnchor 使其工作：

这个代码看起来像：

// Yellow UILabel
addSubview(captionLabel)
captionLabel.anchor(top: actionButtonsStackView.bottomAnchor, left: leadingAnchor, bottom: nil, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)
captionLabel.heightAnchor.constraint(greaterThanOrEqualToConstant: 0).isActive = true

// Green UILabel
addSubview(dateLabel)
dateLabel.anchor(top: captionLabel.bottomAnchor, left: leadingAnchor, bottom: nil, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)

但它为什么有效？我想通过设置更大的ThenOrEqual 常量，黄色的UILabel 自动调整大小以容纳其内容，而绿色的UILabel 会根据bottomAnchor 的黄色UILabel 调整其大小。

Answer 1

那是因为您要添加两个具有相同垂直内容拥抱优先级的标签（默认为low）。如果希望绿色标签更高，可以将红色标签的Content Hugging Priority 值设置为high 或required。代码如下：

// Yellow UILabel
addSubview(captionLabel)
captionLabel.setContentHuggingPriority(.defaultHigh, for: .vertical)
captionLabel.anchor(top: actionButtonsStackView.bottomAnchor, left: leadingAnchor, bottom: nil, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)

// Green UILabel
addSubview(dateLabel)
dateLabel.anchor(top: captionLabel.bottomAnchor, left: leadingAnchor, bottom: bottomAnchor, right: trailingAnchor, paddingTop: 0, paddingLeft: 8, paddingBottom: 0, paddingRight: 8, width: 0, height: 0)

更多详情可以这篇文章：https://medium.com/@abhimuralidharan/ios-content-hugging-and-content-compression-resistance-priorities-476fb5828ef