可变宽度标签列的 iOS 自动布局

Question

目标

我正在尝试使用自动布局约束实现以下设计:

我尝试过的

中间的标签很简单(水平居中查看)。

左右标签不是那么简单。简单地添加 20 的 Leading 和 Trailing Space 约束不适用于所有内容。此外，下方的详细信息标签可以更宽。

我考虑过为左右标签提供 >= 20 的 Leading 和 Trailing Space 约束并使文本居中。

问题

如何在以下情况下实现具有动态内容的 3 个标签的列布局:

• 确保它们之间至少有 20pt 的间距
• 对于较小的内容，确保左右标签内嵌超过 20pts

Answer 1

在 Auto Layout Programming Guide 中有一个创建等距 View 的示例.该方法是在您想要间隔的 View 之间(以及边缘)创建不可见的“间隔” View ，并使用自动布局设置间隔宽度。间隔器的宽度(或垂直间隔 View 的高度)设置为相等。来自PG:

To space views proportionally
1. Create the visible views.
2. Create the spacer views equal to the number of visible views plus one.
3. Alternate placing your views, starting with a spacer view.
To space two visible views, place all of the views in the following pattern, starting from the left side of the screen and moving right:
spacer1 | view1 | spacer2 | view2 | spacer3.
4. Constrain the spacer views so that their lengths are equal to each other.
5. Create a leading constraint from the first spacer view to the container view.
6. Create a trailing constraint from the last spacer view to the container view.
7. Create constraints between the spacer views and the visible views.