iOS-XIB多控件自动收缩显示

如何让两个甚至多个UI控件自动收缩以及设置它的拉伸优先级呢？

这就是我们经常遇到多个Label并排一起，由于数据未知，导致哪个Label该显示，哪个Label显示为"XXXX..."呢？

首先这里我们需要基本的AutoLayout在XIB里运用

比如：设置单个控件随着屏幕大小自动拉伸。以及设置单个控件的固定宽高和各个方向的间距。

我们以两个Label为例：暂且我把它叫做：One、Two，如图1所示

图1

无论数据有多少，根据屏幕大小自动收缩，两个Label就显示一行。

正常情况下，如果需求不是特别要求，我们可以直接添加两个Label的距左、距上的约束就可以了，当有数据后，两个Label都会自动拉伸且并排显示，如图2所示

图2

这个需要事先知道两个Label显示的数据加起来的长度不会超过屏幕宽度，但是实际上我们往往不会知道，而且数据不确定性，于是乎就造成了这样的现象，如图3所示

图3

很明显第一个Label的数据太多了，直接把第二个Label的数据给“顶”出去了。

那么问题就来了，如何同时把两个Label的内容都显示呢？

首先我们需要知道Content Compression Resistance Priority属性。个人理解就是压缩优先级，谁高就往低的一方挤。

具体操作：

我们需要为第二个Label添加距离右边的约束，我这里设置的是距离右边框>=10。至于为啥是>=,那不就是强制第二个Label不被挤出界面 最小间隔10嘛。

设置完你会发现约束报错！！！我擦～就是这样 如图4所示

图4

我们点击进入 错误约束 里去看看：如图5所示

图5

错误的意思是你添加的约束无法确定两个Label的位置，需要给某一个Label添加一个水平方向压缩优先级（我个人理解）你想让哪边显示全你就选择哪个，我们暂且让第一个Label显示全,选择One，点击“Change Priority”（上面写着750 to 751,默认是750级别，变成751之后会优先显示自己，压缩旁边低于750的）。当然你也可以主动在到界面去设置，如图6所示

图6

设置完你会发现，第二个Label还是会被挤，但是不会被挤出界了。

那问题又来了，我怎么让第一个Label少挤一点，留点空间给第二个Label显示呢？

这是我们没有设置第二个Label的最小显示宽度，也就是Width的最小值。

好，我们再为第二个Label添加一个Width >= 50 的约束 如图7所示

图7

这样即使第一个Label的内容再多，也会留 50的距离 给第二个显示了。

这时候会思考的小伙伴 就会想了，那我设置第一个Label的最大显示宽度也可以给第二个Label留显示的空间。没错，就是这样的。

那么除了水平方向是这样设置，那垂直方向也是同理，感兴趣的小伙伴可以自己去试一下。我就不在此献丑了～

有疑问、和错误的欢迎留言，我会一一回复和解答的。

第一次写技术博客，紧张，激动，感慨万千！！！也算是对自己学习到的知识巩固一下。

以前都是伸手党，今天终于体会到了“原创不易”啊，希望自己以后能多多坚持写写。