iOS8 Size Classes的理解与使用
Size Classes是什么
iOS 8在應用界面的可視化設計上添加了一個新的特性-Size Classes,對于任何設備來說,界面的寬度和高度都只分為兩種描述:正常和緊湊。這樣開發(fā)者便可以無視設備具體的尺寸,而是對這兩類和它們的組合進行適配。這樣不論在設計時還是代碼上,我們都可以不再受限于具體的尺寸,而是變成遵循尺寸的視覺感官來進行適配。在Xcode中的具體體現(xiàn)如下圖:
但是我們看到圖中的寬度和高度都是Any,Any是什么意思呢?如果weight設為Any,height設置為Regular,那么在該狀態(tài)下的界面元素在只要height為Regular,無論weight是Regular還是Compact的狀態(tài)中都會存在。這種關系應該叫做繼承關系,具體的四種界面描述與可繼承的界面描述如下:
- w:Compact h:Compact 繼承 (w:Any h:Compact?,?w:Compact h:Any?,?w:Any h:Any)
- w:Regular h:Compact 繼承 (w:Any h:Compact?,?w:Regular h:Any?,?w:Any h:Any)
- w:Compact h:Regular 繼承 (w:Any h:Regular?,?w:Compact h:Any?,?w:Any h:Any)
- w:Regular h:Regular 繼承 (w:Any h:Regular?,?w:Regular h:Any?,?w:Any h:Any)
我們知道了iOS 8下面設備界面可以描述為4種,但是這么多設備(iPhone4S,iPhone5/5s,iPhone6,iPhone6 Plus,iPad,Apple Watch)具體對應什么描述呢?經過查看官方文檔和具體實踐得知具體對應關系如下:
- 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)
- Apple Watch(猜測)
- 豎屏:(w:Compact h:Compact)
- 橫屏:(w:Compact h:Compact)
Size Classes手寫代碼
為了表征Size Classes,Apple在iOS8中引入了一個新的類,UITraitCollection。這個類封裝了像水平和豎直方向的Size Class等信息。iOS8的UIKit中大多數UI的基礎類(包括UIScreen,UIWindow,UIViewController和UIView)都實現(xiàn)了UITraitEnvironment這個接口,通過其中的traitCollection這個屬性,我們可以拿到對應的UITraitCollection對象,從而得知當前的Size Class,并進一步確定界面的布局。和UIKit中的響應者鏈正好相反,traitCollection將會在view hierarchy中自上而下地進行傳遞。對于沒有指定traitCollection的UI部件,將使用其父節(jié)點的traitCollection。這在布局包含childViewController的界面的時候會相當有用。在UITraitEnvironment這個接口中另一個非常有用的是-traitCollectionDidChange:。在traitCollection發(fā)生變化時,這個方法將被調用。在實際操作時,我們往往會在ViewController中重寫-traitCollectionDidChange:或者-willTransitionToTraitCollection:withTransitionCoordinator:方法(對于ViewController來說的話,后者也許是更好的選擇,因為提供了轉場上下文方便進行動畫;但是對于普通的View來說就只有前面一個方法了),然后在其中對當前的traitCollection進行判斷,并進行重新布局以及動畫。代碼看起來大概會是這個樣子:
1 - (void)willTransitionToTraitCollection:(UITraitCollection *)newCollection 2 withTransitionCoordinator:(id <UIViewControllerTransitionCoordinator>)coordinator 3 { 4 [super willTransitionToTraitCollection:newCollection 5 withTransitionCoordinator:coordinator]; 6 [coordinator animateAlongsideTransition:^(id <UIViewControllerTransitionCoordinatorContext> context) 7 { 8 if (newCollection.verticalSizeClass == UIUserInterfaceSizeClassCompact) { 9 //To Do: modify something for compact vertical size 10 } else { 11 //To Do: modify something for other vertical size 12 } 13 [self.view setNeedsLayout]; 14 } completion:nil]; 15 }?
在兩個To Do處,我們要手寫代碼針對不同的狀態(tài)做調整。
Size Classes與Interface Builder
Xcode6中Interface Builder對Size Class有了很強大的支持,xib中可以開啟Size Classes如下圖:
在不同的Size Classes描述下,界面元素可以選擇安裝還是不安裝,具體操作如圖:
Size Classes與Image Asset
Xcode6中Image Asset也支持了Size Class,也就是說,我們可以對不同的Size Class指定不同的圖片了。在Image Asset的編輯面板中選擇某張圖片,Inspector里現(xiàn)在多了一個Width和Height的組合,添加我們需要對應的Size Class,然后把合適的圖拖上去,這樣在運行時SDK就將從中挑選對應的Size的圖進行替換了。支持Size Class的Image Asset編輯效果如下:
?
總結
以上是生活随笔為你收集整理的iOS8 Size Classes的理解与使用的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 绝不能错过的10款最新OpenStack
- 下一篇: 针对访问控制列表ACL 与 基于角色的访