居中对齐stackView，同时保持固定间距答案

【问题标题】：Center align stackView while maintaining fixed spacing居中对齐stackView，同时保持固定间距
【发布时间】：2019-02-07 16:14:23
【问题描述】：

我有一个 UITableViewCell 应该显示两个标签，其中一个标签的高度可以是 1 行或 2 行。标签之间应该有固定的间距。它们总是一起在单元格中垂直居中。

我认为 UIStackView 将是一个很好的解决方案，但没有一个分发选项允许项目之间的固定间距。对所描述的场景有什么好的解决方案？我附上了一个插图（灰色 = 单元格，线条 = 单元格的垂直中心）以使这更容易

【问题讨论】：

有点混乱...您的图像是否显示了您当前得到的东西，但您不希望这样？还是那些您想要实现但无法获得的图像？
图像是我想要的，但到目前为止我无法使用 UIStackView 实现。
OK.... 您的图像显示的行高为 Constant 210 ... 对吗？即单元格/行高不应该根据行数改变？
没错。但我不确定这是否会影响结果？目标是使两个标签（作为总和）以行的 centerX 轴为中心。

标签： swift alignment uilabel uistackview

【解决方案1】：

您的图像实际上并未显示垂直居中的标签。

每个标签中只有一行，它们都是 20.5 磅高（假设默认字体/大小），间隔 12 磅。美好的。很容易以 Y 轴为中心。

顶部标签有两行，变成(20.5-pts + 0-gap + 20.5-pts)，然后是12-pt gap，然后是20.5-pt单行标签.所以这不是文本行的均匀分布，这就是为什么堆栈视图的垂直居中不会使中心线穿过第二行文本的中心线。

如果您检查您的图像（我假设您是手动布局的），您在视图顶部和顶部标签顶部之间有 201 像素，但在视图顶部和顶部标签顶部之间只有 198 像素底部标签的底部和视图的底部。

如果这确实是您想要的布局，您可以这样做：

设置固定的行高
给你的堆栈视图一个 centerYAxis 约束
保留对该约束的引用

然后，覆盖willDisplay cell：

override func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
    if let c = cell as? ExampleCell {

        cell.layoutIfNeeded()

        let topHeight = c.topLabel.frame.height
        let botHeight = c.bottomLabel.frame.height

        if topHeight > botHeight {
            c.stackViewCenterYConstraint.constant = 6.0
        } else if botHeight > topHeight {
            c.stackViewCenterYConstraint.constant = -6.0
        } else {
            c.stackViewCenterYConstraint.constant = 0.0
        }

    }
}

6.0 的值是堆栈视图间距的 1/2 (12 * 0.5 == 6)，因此如果您更改间距，则需要更改它。

这是结果（红线是垂直中线）：

【讨论】：

谢谢。是的，在我的图像中，轴偏离了 1 个像素，但除此之外，一切都居中。也更多地作为例证而不是字面意思。你的方法很有趣，会试一试。总体上希望找到一个解决方案，我不必使用可以在单元格布局中应用的固定参数（标签之间的 12 像素间距除外）。
您可以在单元格中添加一个函数以返回其 stackView 的 .spacing，并将其除以 2，而不是硬编码 6.0 值。