UIStackView to resize/layout

自適應、適配、布局這幾個關鍵詞一直伴隨著iOS開發，從以前的單一尺寸屏幕，到現在的多尺寸屏幕，Apple一直致力于讓開發人員盡可能少在這些事上耗費過多的精力，所以Apple在2012年推出了Auto Layout特性，2014年又推出了Adaptive Layout、Size Classes，2015年iOS 9中又增加了新的控件：UIStackView。這些無一不是我們開發者做適配的利器。

UIStackView簡介

UIStackView Class Reference 1

The UIStackView class provides a streamlined interface for laying out a collection of views in either a column or a row. Stack views let you leverage the power of Auto Layout, creating user interfaces that can dynamically adapt to the device’s orientation, screen size, and any changes in the available space. The stack view manages the layout of all the views in its arrangedSubviews property. These views are arranged along the stack view’s axis, based on their order in the arrangedSubviews array. The exact layout varies depending on the stack view’s axis, distribution, alignment, spacing, and other properties.

simple display

UIStackView提供了一個高效的接口用于平鋪一行或一列的視圖組合。對于嵌入到StackView的視圖，你不用再添加自動布局的約束了。Stack View管理這些子視圖的布局，并幫你自動布局約束。

StackView其實一個視圖容器，不過它會對它的子視圖根據一定規則自動布局，將子視圖按棧的排列方式進行布局。

UIStackView主要的屬性

一般情況下，我們不需要對stackView.subviews做任何約束，只需要通過對stackView的axis, distribution, alignment, spacing屬性進行修改 2

• Axis 方向
  StackView有水平和垂直兩個方向的布局模式
  

  axis

• Spacing 間隔
  StackView可以設置子視圖之間的間隔

• Alignment 對齊方式
  StackView可以設置子視圖的對齊方式（水平方向和垂直方向的該屬性值有所區別）：
  

  alignment
  • Fill：子視圖填充StackView。
  • Leading：靠左對齊。
  • Trailing：靠右對齊。
  • Center：子視圖以中線為基準對齊。
  • Top：靠頂部對齊。
  • Bottom：靠底部對齊。
  • First Baseline：按照第一個子視圖中文字的第一行對齊，同時保證高度最大的子視圖底部對齊（只在axis為水平方向有效）。
  • Last Baseline：按照最后一個子視圖中文字的最后一行對齊，同時保證高度最大的子視圖頂部對齊（只在axis為水平方向有效）。

• Distribution 分布方式
  StackView可以設置子視圖的分布方式：
  

  • Fill：默認分布方式。
  • Fill Equally：子視圖的高度或寬度保持一致。
  • Fill：Proportionally：按比例分布。
  • Equal Spacing：子視圖保持同等間隔。
  • Equal Centering：每個子視圖中心線之間保持一致。

• baselineRelativeArrangement
  determines whether the vertical spacing between views is measured from the baselines.
  決定了其視圖間的垂直間隙是否根據基線測量得到，選中 Baseline Relative 將根據subview的基線調整垂直間距。3

• layoutMarginsRelativeArrangement
  determines whether the stack view lays out its arranged views relative to its layout margins.
  決定了 stack 視圖平鋪其管理的視圖時是否要參照它的布局邊距，選中 Layout Margins Relative 將相對于標準邊界空白來調整subview位置。

UIStackView的嵌套

Typically, you use a single stack view to lay out a small number of items. You can build more complex view hierarchies by nesting stack views inside other stack views.

既然UIStackView繼承了UIView，那么UIStackView也可以看做是一個UIView而被包含在UIStackView內，亦及嵌套使用。

UIStackView的嵌套

UIStackView 與 UICollectionView 的選取

UIStackView 實現有對齊要求的視圖布局非常非常得簡單，而使用 UICollectionView 和 UITableView 來實現，相對而言就比較麻煩。
相比于collectionView而言，stackView更加小巧靈活，然而想要完成更精致的效果，最終還是得使用UICollectionView。

注意！

Be careful to avoid introducing conflicts when adding constraints to views inside a stack view. As a general rule of thumb, if a view’s size defaults back to its intrinsic content size for a given dimension, you can safely add a constraint for that dimension.

1. Distribution 分布方式的方向垂直于Axis。
2. 有時可能排版較亂，除了設置屬性來布局之外，我們還可以手動添加屬性，且"手動添加的享有更高的優先級"。
(Apple官方建議開發人員應優先采用StackView來設計用戶界面，然后再根據實際需求來添加約束)

后記

The UIStackView is a nonrendering subclass of UIView; that is, it does not provide any user interface of its own. Instead, it just manages the position and size of its arranged views. As a result, some properties (like backgroundColor) have no effect on the stack view. Similarly, you cannot override layerClass, drawRect:, or drawLayer:inContext:.

UIStackView不是萬能的，但它可以在布局和自適應方面給開發者帶來便利，在恰當的情形下使用StackView可以事半功倍。而且因為UIStackView是UIView的子類，所以也可以將動畫效果作用于UIStackView上，在方便布局之余還能提高用戶體驗。

隔桌安卓小伙伴不滿了，這不就是LinearLayout嗎？
額 -_-!

ThanksTo:

[1] UIStackView Class Reference --
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIStackView_Class_Reference/index.html#//apple_ref/occ/instp/UIStackView/distribution
[2] UIStackView小窺 --
http://www.devtalking.com/articles/uistackview/?utm_source=tuicool&utm_medium=referral
[3] 簡便的自動布局，對UIStackView的個人理解！ --
http://www.cnblogs.com/bokeyuanlibin/p/5693575.html

// 純代碼的下次再總結