将多个UILabel放在一行的中心

本文介绍了将多个UILabel放在一行的中心的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我想将多个UILabel（作为一个组）水平居中放置在Interface Builder中的一行上。一个直视控制器我不知道如何做到这一点。我阅读了有关将UILabel放置在视图中，然后将视图置于视图控制器中心的注释。当我尝试此操作时，我说过要在接口构建器中更新框架，然后将View调整为最小大小。 （即IB将其高度和宽度设置为0）。我需要知道如何使它在界面构建器中工作。

下面是包含多个我想水平居中的标签的行的示例。大括号仅表示每个标签的开头和结尾，而不是文字的美。 <-6->表示从标签1到标签2的尾随空格为6

标签1标签2 [评分：0.0] <-6-> [距离：125.34公里]

任何建议将不胜感激。

以下是我所做的确切示例，它不起作用：

在IB中创建新的视图控制器

在页面顶部放置一个页面标签，该标签水平居中并与布局指南的顶部对齐。

在页面上添加具有以下约束的视图：

现在添加两个标签到具有以下约束的视图：

完成此操作后，我将收到以下错误，更新框架将使其高度和宽度为0

这是该页面的外观IB：

我需要自动调整视图的高度和宽度，以便在视图中放置多行标签，并将视图的所有内容作为一个组并居中在页面上。

任何建议将不胜感激。

解决方案

缩写布局上所有约束的工作集的快照，该布局会生成一个始终居中的视图，该视图将随子视图自动调整大小（即，随着任何标签内容的更改，视图在其周围扩大或缩小）。

对于您的解决方案而言，视图没有高度和宽度约束；

关键是每个组件都有直接或间接的约束，可以从中指定或推断其大小和位置。例如，为了使视图推断其宽度，子标签必须在第一个标签上具有前导空间约束，在最后一个标签上具有尾随空间约束，并在内部标签之间具有水平空间约束。这些约束加上标签的内容允许推断视图的宽度...并强制视图动态地符合该宽度。

视图的高度。例如，您可以仅指定一个标签或全部标签的顶部和底部空间。如果只是一个，则其余标签可以与其垂直对齐（请参阅屏幕截图中的将中心Y与Label1对齐）。

I want to horizontally center multiple UILabels - as a group - on a line in Interface Builder. One the straight view controller i could not figure out how to do this. I read comments about place the UILabels in a View and then centering the view in the view controller. When I tried this, overtime I said to update frames in the interface builder, the View would be resized down to nothing. (i.e. its height and width would be set to 0 by IB). I need to know how to get this to work in interface builder.

An example of a line containing multiple labels I want horizontally centered is below. The braces simply indicate the start and end of each label and are not art of the text. The <- 6 -> is meant to indicate the trailing space from label 1 to label 2 is 6

Label 1 Label 2 [Rating: 0.0]<- 6 ->[Distance: 125.34 Kilometers]

Any suggestions would be greatly appreciated.

Here is an EXACT example of what I have done and it does not work:

Create a new view controller in IB

Place a page label at the top of the page centered horizontally and aligned to the top of the layout guide.

Add a view with the following constraints on the page:

Now add two labels to the view with the following constraints:

Once this is done I get the following error and updating the frames will cause it to be give a height and width of 0

Here is what the page looks like in IB:

I need the height and width of the view to size automatically so that I have put a multiline label in the view and have all the contents of the view treated as a group and centered on the page.

Any suggestions would be greatly appreciated.

解决方案

Here is a snapshot of a working set of all the constraints on an abbreviated layout that produces an always-centered view that automatically resizes with the child views (i.e., as the content of any label changes, the view grows or shrinks around it).

Important to your solution, the view has neither a height nor width constraint; its size is constrained entirely by its descendant constraints.

The key is that every component has a direct or indirect constraint from which its size and position are specified or can be inferred. For example, in order for the view to infer its width, the child labels must have a leading space constraint on the first label, a trailing space constraint on the last label, and a horizontal space constraint between interior labels. Those constraints plus the contents of the labels allow the width of the view to be inferred ... and force the view to dynamically conform to that width.

The same applies for the view's height. For example, you can specify the top and bottom space of just one label, or all of them. If just one, the remaining labels can be vertically aligned with it (see "Align Center Y to: Label1" in the screenshot).