size classes 概念

我最喜歡的Xcode6的特性是新的size classes 概念，有了它，我們解決了“我如何能夠快速的為那麼多不同尺寸螢幕以及方向的裝置寫app”。他們也讓在一個storyboard中建立一個通用的app。通過與新的适應螢幕的controller聯合，它能夠更簡單的依靠interface builder，而不是與之對抗，進而簡化了你應用的布局。

應用中的每一個view controller 都有一個特别的collection對象，這個特别的collection對象都有兩個size classes，一個垂直size class 一個水準的size class。并且每一個class都有3個可能的值：compact,regular，或者any。這些值都能基于裝置和方向進行改變。你的app将會基于目前的size classes為每一個view controller 布局好它的界面。蘋果使用一個網格來讓使用者選擇哪個設定來工作，是以這裡有一個網格包含了裝置與方向，

如圖高亮的是所對應的size class 組合：

一個有趣的事情：ipad 是 regular x regular 。正如蘋果在 "What's new in iOS8 guide"中描述的那樣：

“With the amount of screen space available, the iPad has a regular size class in the vertical and horizontal directions in both portrait and landscape orientations.”

— Dr. Dre*”

好了，書本材料就到這裡，接下來打開Xcode6 讓我們試一下。根據蘋果的NDA以及Xcode6的截圖，而下面的這些截圖都來自于Xcode5，是以我這些圖檔僅僅是一些引導。

建立一個新的通用項目。如果你想要早在一個已經建立了的Xcode6項目，你需要激活size classes選項。你可以在Interface Builder中的屬性面闆 勾選autolayout 的選項的下面找到它。

首先，讓我們在Xcode中看一下size class的網格。這是一個你可以在不同的布局排列間切換的區域。當你檢視storyboard的時候，看到視圖的底部，并且點選‘wAny hAny’字樣的标簽。你将會看到一些類似網格的畫面。

（譯者：原文中都沒有這個網格的截圖我正在這裡截圖一個吧。）

預設的，我們以一個基礎的設定開始，也就是any width和any height。很多事情都将在這裡安置和改變，包括了iphone和ipad的所有方向的預設布局。蘋果建議把大多數的設定都在這個界面中進行設定。這個是因為減少工作量而顯得特别的簡單。讓我們布局一個超級寬的按鈕在畫面的中間。給它一個綠色的背景，進而讓我們看到它真實的尺寸，給它一個限制來讓他居中。

并且給它一個誇張的固定寬度600。

好了，現在在ipad和iphone的模拟器都運作一下，你将會看到都是居中，但對于iphone的兩個方向都太寬了，（這裡你設定了頁面中button的寬度 但并沒有馬上更新是因為 你在做添加限制的時候沒有更新圖形，導緻了如下圖的情況，storyboard裡面沒有更新，而在模拟器運作時候更新了，左邊大綱欄目裡面也有警告說明，可以直接點選警告裡面的***三角來更新畫面其實就是 Updata Frame）

讓我們使用size classes來修正吧。回到剛才那個第一張圖的網格選擇iphone的縱向（portrait）設定，就是緊湊的寬度+ 正常的高度。網格中的紅色矩形。

你将會注意到你在網格中選中之後底部的bar改變為藍色。那是在警告你：“Hey ，你并不是在一個基礎的設定，有些改變将會隻在你運作的時候顯示。是以這個bar現在是藍色的！” 我所說的一些改變是因為有四項你能改變的size classes：1限制常數，2字型，3限制的開/關，4子視圖的開/關。

前兩個是不言而喻的，但是讓我來告訴你如何讓後兩者工作。在目前的size class （compact width 和 regular height）狀況下讓我們試着把一個限制關閉。在文檔的提綱欄裡，點選設定在我們的button的Centre X 校準限制：

現在看一下我們的屬性檢查欄，在底部我們可以看到帶标記的一個單詞“Installed”，并且左側有額外的加号按鈕。點選額外的加号并且點選'Compact Width| Regular Height'(目前的就是）。

現在你将會看到2個标記物，把剛剛添加的哪一個取消勾選（wC hR）

現在我們的限制不再安置并且做任何事情來配置size classes。就像你看到的，Xcode正在控訴我們的限制太混亂了（左邊的大綱會有錯誤提示表示你缺少了限制-譯者），如果你這時候運作app在iphone的模拟器上的話，按鈕不在X方向居中了。但是在ipad的上面還是居中的，因為限制仍然安置在基本的設定裡面。這個限制将會一直配置着除非我們把它取消勾選。你甚至能夠旋轉你的iphone模拟器，并且發現button将會神奇的回到居中，因為iphone的橫向是不同的size class配置，好了，讓我們把勾選回來，讓button回到居中。

現在讓我們改變我們設定在button寬度的限制，選擇button，并且來到Size的屬性檢查欄，下拉到底部，我們可以看到所有的限制。點選Width原本是600的 使用Edit設定為100：

在iPhone的模拟器上運作，你将會看到button已經具備了正确的寬度。運作在ipad的模拟器的時候卻展示了600的寬度，因為我們沒有改變基本設定裡面的寬度。但是，在iphone的橫向landscape仍然看着不怎麼樣，因為iphone的橫向設定來自基本的Any Any 的設定。讓我們修正一下。在網格裡面我們選擇compact Width和Compact Height。也就是第一張圖的藍色網格。

現在我們在這個設定下改變width 的限制，就像我們為了compact x regular改變的一樣。給予一個400的寬度。運作一下iphone的模拟器，并且旋轉到橫向，按鈕有了400的寬度，看上去很棒。達到了我們的預想。有一點很好就是你能看到一個所有的限制的清單，這些都是不同的設定的。僅僅選擇你想要在文檔大綱裡面看到的限制，然後來到屬性檢查欄，他們整齊的排列在初始的常數下面。它标注了每一個基于它所應用的設定。

即使我們決定我們想要隻在iphone橫向landscape模式下button消失，使用size classes 我們隻要反向安置views就像我們反向安置一個限制。選擇我們的UIbutton，滾動到屬性檢查器的底部。通過點選 加号按鈕 給我們目前的設定添加一個新的安置選項，然後取消勾選它。

就像你看到的，那個view 立馬消失了，因為我們在設定裡面反向安置了它，我們立馬就能看到。運作app，你能看到它在縱向的portrait iphone上消失了，但是當你旋轉到橫向的landscape的時候又回來了。當然它也一直安置在ipad上面因為ipad仍然使用的是基本的設定。

最後一個事情就是我們想要顯示如何來在代碼中提示這些設定的改變。size classes 一般都會被UIInterfaceOrientation 或者UIUserInterfaceIdiom 替代。是以對于了解如何在代碼中工作很重要。你需要做的第一個事情設定你的view controller 來符合UITraitEnvironment協定：

1 2 3 4 5 6

class ViewController: UIViewController, UITraitEnvironment { override func viewDidLoad(){ //code } }

這個協定需要一個 required 方法來 告知你的view controller  trait collection 發生了改變：

override func traitCollectionDidChange(previousTraitCollection: UITraitCollection!) { if previousTraitCollection? { //print out the previousTrait's info println(previousTraitCollection) } }

一個UITraitCollection 提供了一個細節包括了 view controller的屬性：

enum UIUserInterfaceSizeClass : Int { case Unspecified case Compact case Regular }