Autolayout是非常先進的一個技術。使用這種技術，適應不同設備屏幕大小差異或設備翻轉時對界面的要求，變得很容易。這種技術提供了一種靈活的機制來描述界面上各控件的位置關系。

Xcode5使Autolayout技術更容易使用了。 之前，我對Autolayout只是聽說有這種機制，但不知原理、用法。於是閱讀了下面的兩篇文章（作者： Matthijs Hollemans。目前貌似還沒有翻譯），算是在Storyboard/Xib上會用了。

• Beginning Auto Layout Tutorial in iOS 7: Part 1
• Beginning Auto Layout Tutorial in iOS 7: Part 2

以下作為閱讀筆記，記錄應該了解的使用Autolayout的要點(環境是Xcode5，iOS7SDK，Storyboard/Xib)。

原理要點

• Autolayout基本是靠constraints來描述兩個view之間的位置關系
• Autolayout與以往的frame、bound、center包括autosizing mask等方式都不同，這是一個新的技術，使用Autolayout時候就不用考慮以上那些方式啦，不用再糾結這個view的位置是(x,y,width,height)了！
• Autolayout描述位置關系的這兩個view，或者是上下層關系，或者是同一層關系。即父子關系或都是父的子（兄弟關系^_^）
• Constraints都是NSLayoutConstraint的對象，有一些屬性可以在Attributes inspector中修改。當然也可以通過code的方式來實現Storyboard/Xib上的操作

使用方式

這裡只介紹Storyboard/Xib使用方式，如果想了解code實現，還要繼續閱讀其他資料。

設計及實現方法：

理清view想要擺放的位置邏輯（設計），根據這個邏輯來設置Constraints（實現）。比如這個Button要距離那個Button固定20個點的距離，並且兩個Button要頂端對齊等。把這些邏輯條件變成constraints，當constraints完備到可以確定view的位置時，就完成了設計和實現。

在Storyboard/Xib上使用

• Autolayout的checkbox默認是check上的，這個配置是對整個Storyboard或整個Xib生效的
• 可以設置Constraints的地方1 Editor菜單下的Pin以上的4個菜單

  2 在View層次列表中選中Constraints後，在Attributes Inspector中設置

  

  3 最方面快捷的方式是在懸浮在界面編輯右下角的幾個圖標

  

• 藍色的輔助線：表明Constraints已經足以說明這個view的位置了

• 橙色的輔助線：表示constraints沒有完備到可以說明這個view的位置

• 橙色的輔助線上的數字：有時是正數，有時是負數。當你設定或更改了Constraints的時候，可能Constraints與界面上你放置的view的位置是不同的。系統會以Constraints為准，界面上提示你橙色輔助線，線上的數字是這個view的位置與Constraints的差距。這時可以在“Resolve Auto Layout Issues”中選擇update frame，這樣這個view會自動移動到Constraints所指示的地方；也可以update constraints，這時view的位置不變，constraints變為與界面上的view位置一致的數值
• 對沒有提供Constraints的view，系統會自動加上constraints，這些constraints是界面上不可見的。這一點是Xcode5與Xcode4在Autolayout技術升級上最大的改進！Xcode4是系統強加constraints，往往會對開發者進行了干擾，因為強加的Constraints往往不是你想要的。Xcode5的這個改進方便了開發者按照自己的意圖去設計和實施：首先不用去修改系統強加的constraints；其次有些view的位置你不需要增加Constraints，就可以不用理會。注：這種自動給View加Constraints的方式只適用於你一個Constraints都沒加的情況，如果你加了x方向的，y方向的也需要手動添加。
• preview：preview可真方便，你一邊在左側（Portrait、4寸屏）設計實施，一邊在preview中看到lanscape的樣子或者在3.5寸屏中的樣子

• 可設置的constraints的類別：
  1. 幾個View之間對齊
     • 邊緣對齊、中心對齊等
     • 這幾個view寬、高相等等
  2. 相對距離。
     • 距離最近的一個view的距離
     • 兩個view之間的距離
     • 距離頂端、底端、左邊緣、右邊緣的距離
     • 自己的寬、高

接下來

以上是一些基礎要點，當你用Storyboard/Xib做設計的時候，基本就夠用啦。如果覺得這些要點不夠，可以參照Matthijs Hollemans在這兩篇文章中舉的例子，這個例子將帶你進行一步步操作。

有些特殊的場景，使用Storyboard/Xib的autolayout是無法實現，需要代碼方式的autolayout來實現。代碼實現主要圍繞著對NSLayoutConstraint對象的操作。具體如何實現，等需要的時候再找時間研究了。