xib自动布局的一个小妙招
2017-10-29 本文已影响127人
Aaron_ZhangKH
引言
xib是大多数iOS开发者常用且喜欢用的开发方式, 尤其是将xib用在TableViewCell上. 但是使用xib时经常会遇到一种情况, 下面将通过一则故事来分析这种情况.
一个被产品经理虐的故事
-
有一天产品经理让你做个列表视图(UITableViewController), 其中每个单元格都一模一样, 只需要两个Label放在一左一右且垂直居中, 而且它俩文字内容都是固定的. 于是你创建了一个cell, 并添加约束如图1和图2所示:
图1
![](https://img.haomeiwen.com/i3007158/d13025fecf07e5f0.jpeg)
- 第二天产品经理走过来跟你说, 左边的label的文字要做成动态的, 也就是长度是不固定的, 你默默点头, 又添加了新的约束如图3和图4所示:
![](https://img.haomeiwen.com/i3007158/9e2359935cc6f30f.jpeg)
![](https://img.haomeiwen.com/i3007158/350e000dbf2c8ead.jpeg)
- 乍一看好像没什么问题, 最多就是左边的文字偶尔太长, 导致显示不全而已. 然而第三天产品经理走过来对你笑了笑, 说右边的Label也要做成动态文字, 长度也不固定, 而且一定要全部显示出来. 于是, 你只能默默地把限制右边Label宽度的约束删除了, 接下来再跑一次程序, 却发现这样👇
![](https://img.haomeiwen.com/i3007158/4707f40b36c6cf22.jpeg)
什么东西!!! 为啥右边的文字没了
![](https://img.haomeiwen.com/i3007158/70de38d147c9cccd.jpeg)
- 这里就遇到一个两难的问题, 右边文字是动态的, 而且一定要全部显示出来, 那么就不能限制其宽度, 但不限制它的宽度, 如果左边文字太长, 又会把右边Label的空间给"吃掉". 怎么办? 这时我们今天的主角就上场了.
![](https://img.haomeiwen.com/i3007158/612380c15e13ffa2.jpeg)
- Content Compression Resistance Priority, 也称内容抗压缩优先级(默认优先级都为750).
- 按字面意思理解, 就是Label的文字"不被压缩的优先级", 优先级越高, 就越不可能被压缩. 这个参数分为水平(Horizontal)和垂直(Vertical).
- 在今天的情形中, 我们只需要动用水平参数, 把右边Label的这个参数对应的水平750改成751, 即比左边Label的对应值(750)大一级, 而不被左边Label压榨就OK了, 此时我们再跑一下程序, 结果如下👇
![](https://img.haomeiwen.com/i3007158/14bfafb457be46ac.jpeg)
顺利完成产品经理交代的任务✌🏻✌🏻✌🏻✌🏻 心情如下
![](https://img.haomeiwen.com/i3007158/b9dd480bae326bb3.jpeg)