水平的UIStackView-如何在内部对齐项目，以便一个向左浮动而另一个在中心对齐？

Question

我正在制作“首选项”屏幕，并在顶部标题的布局方面苦苦挣扎。我有一个简单的“后退”按钮和一个标签。要求是，后退按钮必须始终向左浮动，标签必须在中间，其内容居中。

到目前为止，我创建了一个包含两个项目的stackview（水平）。我指定了等距分布，并添加了宽度约束，如下所示： 按钮-60 标签-200

这在一个屏幕上看起来不错，但我确信它不会起作用，因为屏幕宽度在不同设备上以及在纵向/横向之间都不同。

在CSS中，只需将按钮指定为float：left，将标签指定为margin：auto，如何在XIB中使其工作？

下面是供您参考的屏幕截图：

Answer 1

您有一些选择...

---

最简单，最接近您的CSS描述：

按钮从顶部限制为0，从顶部限制为8（根据需要进行调整）；标签被限制为垂直居中于按钮，水平居中以进行查看。

缺点：如果标签上的文字过多，则会与按钮重叠。

---

第二个选项：

与上述相同，但在右上方添加一个“ spacer” UIView ...将其限制为0到顶部，8限制为尾随，垂直居中于按钮，并将其宽度和高度限制为相等。然后，将>= 8约束添加到导致按钮尾随的标签，并将标签尾随分隔器视图前移。这样可以使标签根据其文本水平扩展，但可以防止重叠（如果文本太多，文本将被...截断）。

---

第三种选择-使用堆栈视图：

堆栈视图设置：

Axis: Horizontal
Alignment: Fill
Distribution: Fill
Spacing: 8

约束堆栈视图0到顶部，8个前导和尾随（仅用于侧面的少量填充），添加按钮，标签和UIView。约束 “间隔”视图的宽度等于按钮的宽度。设置按钮的水平Content Hugging Priority = 1000（将使其保持其标题的宽度）。

还有其他方法，部分取决于您是否要执行此处未显示的其他任何操作，但这三种方法都可以完成工作。