使用自动布局居中多个标签

Question

是否可以使用autolayout将这些倒计时标签居中？

我有一个居中的视图（如深蓝色所示），有四个标签：minuteValue，minuteUnit，secondValue和secondUnit。

当倒数计时器低于60秒时，会隐藏分钟标签。是否可以将定时器置于其所处状态的中心位置;即我是否有2个或4个标签？

如果没有人知道自动布局解决方案，我很乐意对其进行编码，但我倾向于尽可能使用autolayout来实现此目的。

Answer 1

在UIView中添加所有4个标签，并将以下约束添加到视图中。

1. 在Container中水平
2. 垂直在容器中

为所有标签添加约束。现在，当您不想隐藏分钟时，请为分钟标签（28标签和mins标签）设置空文本。

希望它有所帮助。感谢。

Answer 2

如果我理解正确，您希望始终居中，无论是两个还是四个标签。在这种情况下，我会为它们添加一个contentView。所以，你收到这样的东西：

YourBlueView - ＆gt; ContainerView - ＆gt; FourLabels

接下来，将您的containerView集中在YourBlueView中：

yourBlueView.addConstraint(NSLayoutConstraint(item: yourBlueView, attribute: .centerY, relatedBy: .equal, toItem: containerView, attribute: .centerY, multiplier: 1, constant: 0))
yourBlueView.addConstraint(NSLayoutConstraint(item: yourBlueView, attribute: .centerX, relatedBy: .equal, toItem: containerView, attribute: .centerX, multiplier: 1, constant: 0))

最后一步，在containerView中为你的标签添加约束，比如

containerView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[firstLabel]|", metrics: nil, views: ["firstLabel": firstLabel]))
containerView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|[firstLabel][secondLabel][thirdLabel][fourthLabel]|",options: [.alignAllCenterY], metrics: nil, views: ["firstLabel": firstLabel,"secondLabel": secondLabel,"thirdLabel": thirdLabel,"fourthLabel": fourthLabel]))

现在，当您将标签宽度设置为0时，它们将保留在中心位置。

另一种解决方案，更清晰，但需要UIStackView。将所有标签放入其中，当您使用故事板时，可以使用故事板窗口下的按钮嵌入堆栈来完成，并将此堆栈视图置于蓝色视图的中心。工作完成了