如何水平居中两个标签？答案

【问题标题】：How to center horizontally two labels?如何水平居中两个标签？
【发布时间】：2013-11-12 08:42:46
【问题描述】：

我有两个标签必须水平居中的非常简单的要求。所以，我选择了它们并选择了编辑器->对齐->水平居中。然后将顶部空间添加到容器约束中。我还需要根据内容大小缩小/增长标签。但是，IB 显示错误和几个警告。我可以通过在它们之间添加销（水平空间）来使标签缩小/增长，但在这种情况下它们不会居中。以下是截图：

以下是错误和警告：

UPDATE theraven 提出了一个有趣的建议，即使用虚拟视图将其水平居中并将两个标签固定在其上。我已经删除了所有现有的约束，添加了这个虚拟视图和中心 X + 中心 Y 约束。然后将两个标签固定在上面（添加了水平空间限制）。但是，我仍然收到一堆错误和警告：

UPDATE2 刚刚更新问题，但仍未找到有效答案。 @Theraven 解决方法适用于 iPhone4、iPhone4S、iPhone5 和 iPhone5S，但它不是真正的居中而是一种解决方法。因此对于 iPhone6 和 iPhone6 Plus，它不起作用，因为前导和尾随空格将被固定，并且不会自动调整大小以适应更大的宽度。

【问题讨论】：

straightforward requirements where two labels must be centered horizontally - 你想让你的视图分成两部分（左和右），然后标签在每个部分居中吗？
@ArkadiuszHolko 是的。
这仍然是模棱两可的。您是否希望左边缘第一个标签第二个标签右边缘之间的空间相等。或左边缘第一个标签屏幕中心和屏幕中心第二个标签右边缘之间的相等空间。在第二种情况下，中心空间的差异会更大。一旦你澄清我会修正我的答案。

标签： ios objective-c interface-builder autolayout uilabel

【解决方案1】：

您可以将这两个标签添加到另一个视图，例如容器视图。然后您需要将其水平居中并添加必要的约束。要添加包含UIView，您可以选择两个标签，转到Editor -> Embed In -> View。

然后您需要添加约束以使包含视图适合两个标签。所以是这样的：

第一个标签（左）：

引领空间走向Superview
Superview 的顶部和底部空间
到下一个标签的水平间距

第二个标签：

超级视图的尾随空间
顶部和底部到超级视图（或顶部与第一个对齐）

然后包含视图应该调整大小以适应两个标签。然后你需要做的就是为这个容器视图添加顶部偏移约束并在父视图中水平对齐。

这样，包含视图将根据需要增长以适应标签和它们之间的空间，并且始终位于父视图的中心。

我截取了我的测试约束，以防它对您有更多帮助。

希望这就是你要找的。p>

【讨论】：

是的，这是有效的方法，但需要冗余的 containerView。早在自动布局出现之前，我就是这样做的。

【解决方案2】：

要解决此问题，请在两个标签之间使用空白 UIView 并将其水平居中。然后将两个标签固定在居中空白视图的两侧。在自动布局中使用这样的间隔视图是常见的约定。

【讨论】：

谢谢，尝试了您的建议，但没有成功。查看更新的答案。
@TJ theraven 答案只能通过固定偏移量（将尾随空格添加到居中的 separatorView（对于左视图），并将前导空格添加到居中的分隔符（对于右视图））起作用。此解决方法适用于 iPhone4 , iPhone4S, iPhone5 和 iPhone5S，但是它不是真正的居中，它只是一种解决方法。因此对于 iPhone6 和 iPhone6 Plus 不起作用，因为前导和尾随空格是常量并且不会自动调整大小。
@Centurion 你也许可以使用左右对齐来解决这个问题
非常聪明的解决方案:)

【解决方案3】：

我真的不喜欢仅仅为了美观而添加另一个视图的想法。

另一种选择是将左视图水平居中，并将数量 X 的右视图与左视图水平隔开。

然后给第一个视图的水平对齐约束一个负值，等于第一个视图宽度加上一半的视图距离。或者使用前面评论中所说的乘数。

但我猜这只适用于固定宽度的视图。

【讨论】：

如何“将数量 X 的右侧视图与左侧视图水平隔开”？

【解决方案4】：

使用居中的UIStackView 作为两个需要间距的标签的容器。

【讨论】：

【解决方案5】：

我不太明白你想做什么。

您得到的错误（在第一个屏幕截图中）是您缺少标签 x 位置的约束。

对于 UILabel，您必须对容器视图的 y 和 x 位置都有约束，当您同时选择它们并选择 Editor->align->center Horizontal 时，您只需说 label1.center.x = label2。中心.x。您仍然需要说明它们在容器视图中的位置，您将顶部空间添加到容器，所以您确实有 y 位置，但您没有说 x 位置应该在哪里。

你说

我有两个标签必须水平居中的非常简单的要求

但是他们应该在哪里？

谢谢

【讨论】：

这没有提供问题的答案。要批评或要求作者澄清，请在他们的帖子下方发表评论 - 您可以随时评论自己的帖子，一旦您有足够的reputation，您就可以comment on any post。
谢谢！我今天才开始，我真的很想发表评论，但我不能因为我没有足够的声誉..但我认为我的回答仍然有一些价值，因为部分问题是关于错误的他明白了..无论如何我明白你在说什么，谢谢！
@oren 请先阅读问题。想象一下，你将屏幕垂直分成两半（左半屏和右半屏），你需要左标签在左半屏水平居中，右标签在右半屏水平居中。一个好的答案是你自己已经尝试过的。
好的，我刚刚做了这样的事情。你知道属性“乘数”吗？它可以帮助您，您可以设置右侧标签“容器中水平居中”（常量为 0）并将其乘数设置为 3/2，左侧的标签相同，但乘数为 1/2。这应该让您的标签保持水平...

【解决方案6】：

使用间隔视图是我能想到的最佳解决方案，即使它对开发人员来说看起来很丑陋。用户甚至不知道幕后发生了什么，一旦你有了间隔器UIView，你就可以随时重复使用它。

【讨论】：