自動布局介紹
創建一個Hello World app是不是很有趣？在我們開始構建一個真實的app之前，我們來看一下自動布局。
馬上開始
自動布局（Auto Layout）是一個基于約束的布局系統。它允許開發者創建一個能夠適應不同屏幕大小和設備的UI界面。有些初學者覺得自動布局（Auto Layout）很難學懂并且回避使用它。相信我，一旦你理解了它，自動布局（Auto Layout）將會成為你最有好的工具，在你開發app的日子里你再也離不開它。
你可能奇怪為什么我要先討論自動布局（Auto Layout）而不是直接編寫真實的app。在Xcode 6使用過程中自動布局（Auto Layout）時不可避免的。我想幫助你在如何布局用戶界面方面打下堅實的基礎。隨著iPhone 6 和6 Plus發布，蘋果公司的iPhone系列擁有的屏幕種類越來越多了。如果不使用自動布局（Auto Layout）技術，那么創建一個支持所有屏幕的app將會非常困難。通過這個章節，你將會感受到Storyboard和Auto Layout的強大力量。
為什么需要自動布局？
讓我舉一個例子讓你更好的理解為什么我們需要自動布局。打開你在第一章創建的Hello World項目。這次我們不要在iPhone 5s仿真器中運行，我們改為在iPhone 4s仿真器中運行，iPhone 4s使用的是3.5英寸屏。
你將會看到如下的結果，很明顯在iPhone 4s中運行時按鈕不在中間位置了。
讓我們再試試其他的。
點擊Stop按鈕，然后使用iPhone 5s仿真器運行app。在仿真器啟動后，在菜單中選擇HardwareRotate?Left或者(Rotate Right)。設備將會被設置為橫屏。我們會再一次看到Hello World不在中間了。為什么會這樣？出了什么問題嗎？首先你要理解iPhone 5/5s和4s有不同的屏幕尺寸。對于iPhone 5/5s在豎屏模式下水平方向有320個點（或者說640個像素），垂直方向有568個點（或者說1136個像素）。對于iPhone 4s，屏幕有320點（640像素）和480點（960像素）
為什么用點替代像素？
在2007年蘋果公司的原始iPhone顯示屏是3.5英寸，分辨率是320*480.確實是水平320像素，垂直480像素。蘋果公司是直接從iPhone 3G和iPhone 3GS繼承過來的分辨率。很明顯，如果那個時候你開發app，一個點就對應一個像素。隨后蘋果公司發布了視網膜屏的iPhone 4.屏幕分辯率翻翻到了640*960像素。所以對于視網膜屏1個點匹配2像素.
采用點的計算方式讓開發人員更加方便。無論屏幕分辨率如何改變（假設分辯率再次翻翻到1280*1920），我們仍然只需處理點和基礎分辨率（如iPhone 4/4s的320*480或者iPhone 5/5s的320*568）。點和像素之間的轉換由iOS完成。
不使用自動布局功能的話，我們在Storyboard中放置的按鈕的位置就是固定的。換句話說，我們“硬編碼“了按鈕的坐標原點。在我們的例子里，“Hello World”按鈕的坐標原點被設置為了（120， 269）。因此，無論你使用3.5英寸還是4英寸的仿真器，iOS都是在指定的點中繪制按鈕。 圖說明了不同設備里的坐標原點。這就解釋了為什么“Hello World”按鈕不能在3.5英寸屏幕和橫屏下正確顯示了。
很明顯，我們希望在3.5英寸屏和4英寸屏上無論豎屏和還是橫屏app都顯示正確。這就是為什么我們需要學習自動布局。這就回答了前面我們提出的問題。
自動布局就是約束
正如前面提到的，自動布局是基于約束的布局系統。它允許開發者創建一個能夠適應不同屏幕大小和設備的UI界面。Ok，這聽起來很不錯。但是“基于約束”是什么東西？讓我們解釋一下。再想想“Hello World”按鈕，你是如何描述你想放置按鈕到中間位置的？你可能想這樣描述：
按鈕應該在水平和垂直方向的中間，無論屏幕分辨率和方向。
這里你實際上就定義了兩個約束：
1、水平中央
2、垂直中央
這些限制描述了interface里放置按鈕的規則。自動布局的核心就是約束。但是我們用語言描述約束，自動布局用數學形式表達約束。例如，你要決定一個按鈕的位置，你可能“按鈕的左邊界需要里它所在的容器的左邊界30個點”。這可以翻譯為button.left = （container.left + 30）。這就是你需要知道的信息。幸運的是，我們不需要自己處理這些公式。
OK，自動布局的理論已經介紹的夠多的了。
現在實現以下如何才能在任何屏幕情況下讓“Hello World”按鈕居中。
使用自動布局居中按鈕
Xcode提供兩種自動布局的方法：
自動布局菜單
拖拽控制
在這一章，我們將演示這兩種方法。讓我們從自動布局開始。打開HelloWorld項目的“Main.storyboard”。在Interface Builder底部的右側你可以看到自動布局菜單。在菜單中的不同按鈕實現不同的有關自動布局的功能。
每個按鈕有自己的功能：
Align（對齊）創建對齊約束，例如對齊兩個部件的左邊緣
Pin（固定）創建空間約束，例如定義UI控件的寬度。
Issue（問題）解決布局問題
Resizing（調整）說明如何調整約束的影響
為了把“Hello World“按鈕放到中間，你需要選中它，然后點擊自動布局菜單中的Align（對齊）圖標。在彈出的菜單中選擇”Vertical center in?container“和”Horizontal?center in container“。然后點擊”Add 2 constraints“按鈕。
你要學會如何看懂約束線。如果約束線是藍色，這暗示你的布局被正確配置沒有風險。如果你想查看已有的約束，你可以在Document Outline and Size?inspector文檔框架和大小查看器中查看。細節如下圖
?
好了，現在可以再次測試app了。你可以點擊Run按鈕運行iPhone4和 5仿真器。即使你在iPhone 6和6Plus仿真器中運行，app看起了都是正確的！
專題目錄：
