自动布局技巧篇-文字横向扩展父视图跟随横向扩展

项目需求场景：

现在有一个文字，文字背后有一个黑色半透明的背景视图，要求文字可以横向增长，但增长到一定长度后保持不变，即显示点点。。而且要求文字增长过程中，其后面黑色半透明背景视图也跟随增长变化 ， 类似下面：

那么该如何实现：

那么首先肯定是一个label,一个父视图，那么父视图是不是这个黑色透明视图呢，当然不能，如果父视图也是透明的，label，放在父视图里面，label肯定也变成透明了，这和我们需求不符合，因为我们需要另外加一个视图，将其设置为黑色，半透明，那么就是三个视图，label,父视图，背景视图

在来看约束，也是关键：

父视图：因为父视图的宽度要随着子视图文字的变大而变大，所以父视图的宽度肯定不能给死，这是一个关键，其他简单，上面给固定值，水平居中，高度给固定值

背景视图：它的目的是为了有一个黑色半透明背景，它和父视图范围是一样的，所以它和父视图上下左右均对齐即可（当然有很多其他方式）

label视图:文字视图有两个关键

1 它会将父视图给撑大，并且是从两边撑大，那么肯定给label左右两边一个固定值约束，

2 label会随着文字的增多而增大，但是上面的需求是label大到一定程度后，即便文字增多，它也不在增大，而是显示点点。。所以label有一个最大宽度maxWidth,所以要给他设置一个宽度值maxWidth，但是是小于等于这个maxWidth,因为你在xib上只能设置约束的固定值（当然可以在xib上基于屏幕设置，但是这里不好适用），而实际项目中这个最大值，可能是屏幕的宽度减去某个数值才在不同屏幕上合适，所以这个maxWidth的约束一般会拖出来在代码中修改

而label的其它约束就很简单，垂直方向居中，高度固定值，

具体操作如下：

demo地址https://github.com/aszkj/KJAutoLayoutSillDemo