【iOS界面開發】Objective-C自動佈局(Auto Layout & SizeClass)

Auto Layout

自XCode 5以後,在開發Mac OS X或iOS應用程序時,我們可以在Interface Builder中使用Auto Layout特性,以適應不同的屏幕尺寸、旋轉方向以及本地化需求。該特性在你新建一個工程後默認處於啓動狀態。

有兩種方式可以使用Auto Layout:

  • 在Interface Builder中,通過在Builder畫布中右鍵拖放,或者在右下角的菜單實現。
  • 通過手動編程實現,需要添加或刪除NSLayoutConstraint實例,有可能會使用到Visual Format Language來指定控件之間的大小和位置關係。

具體的細節可以參見Apple官方提供的“Auto Layout Guide”幫助。

AutoLayout的基本使用

 
在創建約束之後,需要將其添加到作用的view上。在添加時要注意目標view需要遵循以下規則:
1) 對於兩個同層級view之間的約束關係,添加到他們的父view上
2) 對於兩個不同層級view之間的約束關係,添加到他們最近的共同父view上
3) 對於有層次關係的兩個view之間的約束關係,添加到層次較高的父view上

SizeClass

隨着iOS8系統的發佈,一個全新的頁面UI佈局概念出現,這個新特性將顛覆包括iOS7及之前版本的UI佈局方式,這個新特性就是Size Class。Size Class配合Auto Layout可以解決所有(包括iPhone及iPad)iOS設備屏幕尺寸及屏幕旋轉時候的UI適配問題 。

不同設備的SizeClasses

iPhone4S,iPhone5/5s,iPhone6

豎屏:(w:Compact h:Regular)

橫屏:(w:Compact h:Compact)

iPhone6 Plus

豎屏:(w:Compact h:Regular)

橫屏:(w:Regular h:Compact)

iPad

豎屏:(w:Regular h:Regular)

橫屏:(w:Regular h:Regular)

Size Classes

針對iPhone,可以總結爲:

如果項目不支持橫屏顯示,使用w:Compact h:Regular(或者直接取消使用Size Class),它能適應所有的iPhone豎屏狀態。

如果項目支持橫屏顯示,使用w:Compact h:Regular+w:Any h:Compact 

對於一些公有的約束(任意組合中都適用),一般放在w:Any h:Any中設置 

iPad同理

SizeClass的使用建議參考 [iOS] 初探 iOS8 中的 Size Class ,逐步介紹了在不同的Size Class下修改 Constraints,安裝和卸載 Constraints,以及安裝和卸載 View的方法。 iOS 8 SDK爲全面支持SizeClass而做出的適應性變化見WWDC 2014 Session筆記 - iOS界面開發的大一統

iOS8 AutoLayout與Size Class 自悟 爲iPhone 6設計自適應佈局這裏都介紹得很透徹。

另外,自動佈局的Demo還可以參考下面兩個例子,都在github上提供了相關的源碼,值得學習。

xcode6中自動佈局autolayout和sizeclass的使用

自動佈局autolayout使用總結(源碼含swift版本)

發佈了91 篇原創文章 · 獲贊 58 · 訪問量 54萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章