带有两个标签的水平 UIStackView（一个多行标签，一个单行）

Question

我有一个水平的 UIStackView，里面有两个 UILabel。第一个 UILabel 是多行的（两行），另一个只有一行。它们都有默认的内容压缩和阻力优先级。 我的问题 是即使标签之间有空隙，"best" 第一个文本中的单词会出现在第二行。我注意到第一个标签没有超过总宽度的一半。

我想要的 是第二个标签应该始终显示自己，第一个标签的大小应该是剩余的 space。如果它不能适合一行它应该是两行。但是，如果第二个标签太短而第一个标签很长但两者都可以容纳，则第一个标签应超过宽度的一半。

P.S 这个场景需要用到UIStackView，因为还有其他情况。我知道在 UIView 中放置两个标签可能会解决问题。

UIStackView:
   - Distribution: Horizontal
   - Alignment: Center
   - Spacing: 0
   UILabel:
     - Number of line: 2
     - Line break: Word wrap
   UILabel:
     - Number of line: 1

查看层次结构：

想要的结果：

或

编辑： 我计算第二个标签的宽度并给出宽度约束。我认为它解决了我的问题，我会测试一下。

        //Give specific width to second label to make first one calculate right number of lines.
    if let font = UIFont(name: "Metropolis-ExtraBold", size: 15) {
        let fontAttributes = [NSAttributedString.Key.font: font]
        let size = (secondLabelText as NSString).size(withAttributes: fontAttributes)
        secondLabel.widthAnchor.constraint(equalToConstant: size.width).isActive = true
    }

Answer 1

首先将您的多行标签嵌入到一个视图中，并将标签约束到该视图（顶部、前导、尾随、底部）。之后，将带有多行标签和单行标签的视图添加到 stackView。

然后你可以使用 .fillProportionally 来分配你的 UIStackView 和间距值来指定你的两个标签之间的 space。

还要确保在右侧数字标签上使用必需 (1000) 作为水平内容抗压缩优先级。

View-hierarchy:

结果：

标签之间的间距：

Answer 2

您应该为每个设置不同的水平内容抗压缩：

对于这种情况，蓝色的（多行）应该比橙色的（单行）少一些。

_{辅助说明：多行：250，单行：750}

橙色设置：

蓝色设置：

注意我把橙色的行数限制设置为0。您可以将其设置为您喜欢的任何内容。但是如果你想让它自己调整到 anyhight 更高的视图应该具有比 250 更高的 垂直压缩抗性 。

Answer 3

尝试简化...

忘记计算任何宽度...重要的是水平 Content Hugging 和 Content Compression Resistance

保留左侧（蓝色）标签的默认值：

Content Hugging Priority
    Horizontal: 251

Content Compression Resistance Priority:
    Horizontal: 750

但将右侧（橙色）标签设置为：

Content Hugging Priority
    Horizontal: 1000

Content Compression Resistance Priority:
    Horizontal: 1000

结果：

唯一的其他问题是右侧标签中的文本是否超过了视图的整个宽度 -- 但您没有表示您可能需要那么多文本。

带有两个标签的水平 UIStackView（一个多行标签，一个单行）

Horizontal UIStackView with two label (one multiline label, one one-line)

uilabel

ios

swift

uistackview