概覽
UIStackView 為單行或者單列提供自動(dòng)布局苹丸、自動(dòng)伸縮特性汞贸，UIScorllview 提供的特性則contentSize 大于frame.size時(shí)可以滑動(dòng)的特性，理論上將二者的特性結(jié)合起來(lái)就能實(shí)現(xiàn)線性文檔流布局，布局從上之下進(jìn)行排列兴猩。
使用場(chǎng)景
對(duì)于一些樣式非常復(fù)雜的列表，需要為每一種樣式單獨(dú)定義一個(gè)cell類早歇，每個(gè)cell的功能各自不同倾芝，如果使用 UITableView 和 UICollectionView來(lái)實(shí)現(xiàn)，那么就會(huì)在代理方法里面寫(xiě)好多判斷邏輯（想想你的 UITableView 代理方法是不是寫(xiě)了 if箭跳、else if晨另、switch），有時(shí)候一個(gè)- tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath方法里面右上百行代碼谱姓，甚至更多借尿。這時(shí)候使用線性文檔流布局是最好不過(guò)的選擇，將不同樣式的組件各自進(jìn)行封裝，各自處理各自的事件, 然后將組件實(shí)例通過(guò) UIStactView 的 addArrangedSubview 添加到布局流中去路翻，UIStactView 會(huì)根據(jù)添加順序依次進(jìn)行布局狈癞。
表視圖的高度是一個(gè)動(dòng)態(tài)性的高度，像有一些場(chǎng)景中文本需要展開(kāi)和收起功能茂契，使用列表視圖實(shí)現(xiàn)是比較復(fù)雜的蝶桶，而使用 UIStackView 實(shí)現(xiàn)就簡(jiǎn)單很多了，組件內(nèi)部只需要管理內(nèi)部的約束關(guān)系掉冶，UIStackView 自動(dòng)實(shí)現(xiàn)伸縮莫瞬。
有限集列表，對(duì)于無(wú)限集列表還是推薦使用 UITableView 或者 UICollectionView, 原因不用多說(shuō)（UICollectionView 和 UITableView 提供 cell 的復(fù)用機(jī)制郭蕉，在性能方面更優(yōu)）
舉幾個(gè)例子：
WechatIMG393.png
WechatIMG394.png
會(huì)員中心.gif
以上三個(gè)頁(yè)面全部使用UIStackView 作為容器搭建完成
首先看一下 UIStackView 實(shí)現(xiàn)線性布局結(jié)構(gòu)圖
UIStackview線性布局框架.jpg
具體步驟
創(chuàng)建相關(guān)視圖
overridefuncviewDidLoad(){super.viewDidLoad()letscrollView=UIScrollView()scrollView.backgroundColor=UIColor.redletstackView=UIStackView()stackView.axis=.vertical// 縱向布局stackView.distribution=.equalSpacing// 每個(gè)item之間間距相同stackView.spacing=20// 相鄰item之間間距stackView.alignment=.center// 居中對(duì)齊，不對(duì)item進(jìn)行橫向拉伸view.addSubview(scrollView)scrollView.addSubview(stackView)foriin0..<10{letitemView=UIButton()// 為了演示效果這里采用 uibutton喂江，點(diǎn)擊消失對(duì) UIStackView 布局的影響itemView.setTitle("View\(i)",for:.normal)itemView.addTarget(self,action:#selector(handle),for:.touchUpInside)itemView.backgroundColor=.green? ? ? ? ? ? stackView.addArrangedSubview(itemView)}}@objcfunchandle(btn:UIButton){UIView.animate(withDuration:0.25){btn.isHidden=true}}
UIScorllview 約束設(shè)置
scrollView.snp.makeConstraints{(make)inmake.edges.equalTo(self.view)}
UIStackView 約束設(shè)置,關(guān)鍵步驟召锈，設(shè)置 stackView 定寬或者像下面這樣，依賴于 scrollView 的父視圖寬度获询，高度依賴棧內(nèi)子視圖將其撐開(kāi)涨岁，并撐開(kāi) scrollView 的 contentSize
stackView.snp.makeConstraints{(make)inmake.left.right.equalTo(self.view)make.top.bottom.equalTo(scrollView)}
UIStackView 棧內(nèi)子視圖約束設(shè)置
itemView.snp.makeConstraints{(make)inmake.height.equalTo(200)make.width.equalTo(self.view.frame.width-40)}
預(yù)覽效果
線性布局效果.gif
總結(jié)
UIStackView 是 蘋(píng)果官方在iOS 9.0 推出的非常先進(jìn)的容器視圖，結(jié)合自動(dòng)布局能夠快速的幫助開(kāi)發(fā)者完成各種布局效果吉嚣。我在開(kāi)發(fā)《海馬體照相館》app 的過(guò)程中大量的使用了 UIStackView梢薪，有時(shí)間的話分享一篇 UIStackView 的其他方面的應(yīng)用。
