UIStackView相关

从iOS9开始，苹果提供了UIStackView来帮助咱们作布局，这玩意儿相似于安卓的线性布局。由于在使用过程当中会遇到一些坑，因此写出来供遇到一样问题的人参考。我在这里提供xib和纯代码两种方式建立使用 UIStackView：

先看一下运行效果：

 

垂直方向，在图一里，label被拉伸了，在图2里面，label和image被压缩了

一、xib方式

打开storyboard以后会发现右下角多了一个图标：

在xib中建立 UIStackView 要用到这个按钮，就称它为 stack 按钮吧。

首先拖三个控件进来：

而后按住 command键，而后选中这三个View，而后点击右下角的哪一个 stack 按钮。这时候就建立了一个 UIStackView，这个stackView包括了刚才选中的三个View：

图里面绿色箭头指向的就是咱们刚刚建立的UIStackView。

而右上角的红色箭头指向的错误让人纠结了。致使错误的缘由有多个，咱们来一个一个的解决。

第一个缘由：stackView没有约束。

说来奇怪，使用xib建立UIStackView的时候，不能设置 stackview的frame，你看是灰色的：

没办法，不能设置frame，那就设置约束吧，选中stackView，而后给它添加约束以下：

而后咱们看一下结果如何：

效果马马虎虎了，但是TNND仍是有错误：

点进入看给的错误信息，大概意思是须要设置抗压缩等级——这是啥？

这还得从 UIStackView 的排布方式提及，选中stackView，在右侧工具栏查看这个：

挨个说说，

Axis（轴）：这里表明stackView所包含的View的排布方向，有竖直和水平两种，这玩意儿比较智能，在你添加的时候可以自动判断。你也能够咋这里更改。

Alignment（对齐方式）：是指stackview所包含的View的对其方式，有下面几种方式：

        Fill：子View填充 stackView，它会使子View在水平和垂直方向都填充stackView

        Leading：靠左对其

        Trailing：靠右对齐

        Center：中心对齐

        Top：顶部对齐

        Bottom：底部对其

Distribution（分布）：是指 stackview 的子 View的排布方式，有下面几种方式：

        Fill：默认方式，子View加起来田中整个 stackview

        Fill Equally：子View的高度/宽度一致（具体是哪个一致得看是水平排布仍是垂直排布）

        Fill Proportionally：StackView 本身计算出它人为合适的排布方式，合理分配宽/高

        Equal Spacing：子View保持同等间隔的排布方式

        Equal Centering：每一个子View的中心线之间距离相同的排布方式，每一个子view的宽/高会适配其内容

之因此会出现上面的错误，是因为 Fill、Equal Spacing 这两个方式不能自动地对子View进行压缩/拉伸（在子View填充的大小与stackview不符合的状况下）。例如本文的状况，子View的大小加起来比stackView要大，而在Fill模式下，系统又不知道该压缩哪个View，因此才报了错。加入将Fill模式换成 Fill Equally、Fill Proportionlly、Equal Centering就不会出错了。

下面来解决上面的这个问题：

首先在右侧的工具栏选中尺子

在里面找到下面这两个东西：

三个子View都有这两个属性

Content Hugging Priority：压缩优先等级，这个值越低，越容易被拉伸

Content Compression Resistance Priority：抗压缩优先等级，这个值越低越容易被压缩

因此将其中一个View的上面这两个属性调低，使这个View可以被压缩/拉伸，就能够解决上面的问题了

例如，将label的调低，就能解决问题了

----ps，感受xib使用stackView仍是有一些问题的

二、代码的方式：

    func createStackView(){

        //使用代码的方式建立stack的时候是可使用frame的，固然，也可使用约束

        let stack = UIStackView(frame: CGRect(x: 10, y: 20, width: 300, height: 600))

        

        let btn = UIButton(type: UIButtonType.Custom)

        btn.backgroundColor = UIColor.greenColor()

        btn.setTitle("btnbtn", forState: UIControlState.Normal)

        btn.setTitleColor(UIColor.blueColor(), forState: UIControlState.Normal)

        stack.addArrangedSubview(btn)

        

        let label = UILabel()

        label.backgroundColor = UIColor.lightGrayColor()

        label.text = "aaaabbbbccccddddeeeeffffgggghhhhiiiijjjjjkkkklllmmmnnn"

        label.numberOfLines = 0

        stack.addArrangedSubview(label)

        

        let img = UIImageView()

        img.image = UIImage(named: "2")

        stack.addArrangedSubview(img)

        stack.alignment = UIStackViewAlignment.Center

        stack.axis = UILayoutConstraintAxis.Vertical

        //下面这两行是Fill模式的

        stack.distribution = UIStackViewDistribution.Fill

        label.setContentHuggingPriority(249, forAxis: UILayoutConstraintAxis.Vertical)

        

//        stack.distribution = UIStackViewDistribution.FillEqually

//        stack.distribution = UIStackViewDistribution.FillProportionally

//        stack.distribution = UIStackViewDistribution.EqualSpacing

        

        self.view.addSubview(stack)

        

        print(">>>>>>")

    }