多行 UILabel 与固有内容大小的 UILabel 宽度相同

Posted 2023-02-27

【中文标题】多行 UILabel 与固有内容大小的 UILabel 宽度相同

【英文标题】：Multiline UILabel same width as intrinsic content sized UILabel

【发布时间】：2017-10-16 02:38:11

【问题描述】：

我正在尝试使用自动布局对齐两个 UILabel，其中第一个标签没有设置宽度但使用内部内容大小，第二个标签应该与第一个标签的宽度相同，将文本换行到新行。

理想情况下，第二个标签应该将数字行设置为0 以使用动态类型，但我暂时将其设置为2，甚至给它一个特定的高度。然而，当我尝试对齐equal widths 或trailing 时，固有的内容大小标签会扩展到多行标签的宽度，就好像它都在一行上一样（见下图）。

我所追求的：

我所看到的：

在不为第一个标签指定宽度的情况下，我有什么方法可以实现我想要的吗？我希望它随着内容扩展以考虑动态类型，并且第二个标签具有相同的宽度并将所有文本换行到新行。

【问题讨论】：

您能否提供有关第一个标签的更多信息，例如它最多可以包含多少个单词？它的内容可以超过 1 行吗？它是否总是有一些文本或者它也可能是空的？

这似乎是一个愚蠢的问题，但您是否将第一个标签设置为等于第二个标签的宽度，反之亦然？

@Adeel 第一个标签将只包含三个单词，但我希望它是动态的原因是我想添加动态类型并本地化为多种语言，这可能会改变这一点。它永远不会超过 1 行，并且不能为空。

@Jonathan 我将第二个标签的宽度设置为等于第一个（我也尝试将第二个标签的尾随端点约束到第一个），但是它似乎仍然扩展了第一个标签的框架到第二个，好像所有的文本都在一行上。这可能是因为我从来没有给第一个标签一个特定的宽度，这导致它扩展以匹配第二个。

【参考方案1】：

您可以在不将任何内容挂钩到代码的情况下做到这一点。该解决方案的关键是标签的内容拥抱优先级，其大小将完全根据内在内容大小计算。

内在内容大小标签

将横向内容拥抱优先级设置为必需 (1000)

多行标签（lorem ipsum 标签）

对齐前导内在内容大小标签 将尾随与内在内容大小标签对齐

两个标签的 Xcode 配置（左：Intrinsic，右：Multilabel）

【讨论】：

谢谢！我知道内容拥抱/压缩数字可能与它有关，但它们总是让我感到困惑，我无法自己试错以找到解决方案。这是一种魅力！

【参考方案2】：

在layoutSubviews 中，将第二个标签的preferredMaxLayoutWidth 设置为第一个标签的固有宽度，类似这样：

secondLabel.preferredmaxlayoutwidth = firstLabel.intrinsicContentSize.width

【讨论】：

有没有办法在情节提要中实现这一点/我应该在情节提要中做什么，这样它就不会抱怨无法满足的约束？

为什么您的故事板抱怨无法满足约束？请发布错误的屏幕截图。

抱歉，没有更好的词。我只是不知道将它设置为什么。如果我不给它第二个标签任何基于宽度的约束，它就会溢出屏幕（如上面的插图 #2 所示）。我希望情节提要能够准确表示它实际呈现的内容。我可以在故事板中设置任何约束来实现这一点，并帮助我的 VC 远离布局代码吗？

您不必删除故事板上的尾随约束或等宽约束。我的回答并不意味着您的第二个标签不需要这些限制。您甚至可以在情节提要中指定preferredmaxlayoutwiddth，但它在那里是一个常数值，我认为这对您来说并不多，因为您的第一个标签是动态的。你可以再尝试一件事，给你的第二个标签一个尾随约束到 superview 并使其大于 10 或其他东西。

这当然可以实现我所追求的，但我仍然犹豫要不要选择这个解决方案。现在这些标签都没有连接到我的视图控制器，如果可能的话，我更愿意保持这种状态。在寻找替代解决方案时，我会暂缓接受您的回答，但如果我最终使用它，我一定会这样做。如果没有，我将与您分享我最终使用的解决方案。