
顯然Trait Variations替換了以前Xcode7的Size Class(尺寸分類,也叫做自適應布局)??梢钥吹较旅鏅C型與自適應的尺寸匹配起來,變得更加直觀。
一開始接觸自適應時沒有辦法理解(wC hR)這些緊湊、標準有什么用。其實是給不同的機型和設(shè)備在進行UI布局時用的,這個概念暫時放一放。
試著選擇設(shè)備iPhone7(wC hR),在里面放一個標簽如下圖:

然后現(xiàn)在選擇其他設(shè)備瀏覽一下(注意現(xiàn)在什么約束也沒有添加)



橫屏情況:



我們只為iPhone7里的設(shè)備添加標簽,然后其他設(shè)備也都被添加上了標簽。
現(xiàn)在我就考慮,有沒有辦法做到:只在iPhone設(shè)備上添加標簽,而不在iPad設(shè)備添加。非??梢?,而且非常簡單。
我們先刪掉原來的標簽,至于你想在哪臺設(shè)備里刪隨你,因為都一樣。然后再次回到選擇iPhone7設(shè)備上,點擊一個非常神奇的按鈕:

選中Width(下文說有什么用),然后在界面添加一個標簽:

添加完之后點擊Done Varying:

再看其他設(shè)備:






看到?jīng)]有?!所有iPhone設(shè)備的橫豎屏都有標簽,而iPad沒有。等等,好像哪里不對,iPhone7 Plus橫屏時并沒有標簽啊

這個問題下面繼續(xù)?探討,先回來說這個按鈕的作用

它實質(zhì)上是一個過濾器。一旦你選中了復選框,背景會變成深藍色,如下圖


選擇完畢后,其文本是這樣“Done Varying”

選中了Width,意味著選取與你正在布局的設(shè)備具有相同Width的設(shè)備,Height同理。
現(xiàn)在無法回避尺寸分類了。給出3個例子進一步說明:
(1)如果我們正在使用iPhone7 (wC hR)UI布局,且分類按鈕選了Width,那么如果對iPhone7的UI進行修改,會使同為wC的設(shè)備比如(wC hC)、(wC hR)的UI產(chǎn)生改變。
(2)如果我們正在使用iPhone7 (wC hR)UI布局,且分類按鈕選了Height,那么如果對iPhone7的UI進行修改,會使同為hR的設(shè)備比如(wR hR)、(wC hR)的UI產(chǎn)生改變。
(3)如果我們正在使用iPhone7 (wC hR)UI布局,且分類按鈕選了Width和Height,那么如果對iPhone7的UI進行修改,會使同為(wC hR)的設(shè)備的UI產(chǎn)生改變。
因此記住設(shè)備的尺寸分類就能很好地使用自適應布局了。
w和h都只有C和R兩種尺寸選擇。(原來還有一個Any,但在Xcode8已經(jīng)不用了)
那么會數(shù)數(shù)的朋友都知道組合起來就有4種結(jié)果
**(1)(wC hC)
(2)(wR hR)
(3)(wC hR)
(4)(wR hC) **
- 最常用的是第三種(wC hR),它適用于一切尺寸的豎屏iPhone。
- 比較常用的是第二種(wR hR),適用所有iPad的所有橫屏豎屏。
- 剩下的第一種和第四種都只會用在iPhone的橫屏上,而第一種(wC hC)適用于除了iPhone x Plus以外的所有橫屏,第四種(wR hC)適用于iPhone x Plus的橫屏。(其中x為6、6s、7、7s... 遞增序列)。
?再提醒一句,如果你修改完畢后,記得點擊"Done Varying"。對于沒有用習慣的人來說,比如我,使用它是很容易會犯錯誤的。
</br>
說了這么多,來幾道送分題:
(1)為什么上面iPhone 7 Plus橫屏中沒有標簽?
(2)如果我們正在使用iPad Pro9.7’’進行UI布局,如果分類按鈕選了Width和Height,那么對UI進行修改,請問會使哪些設(shè)備的UI產(chǎn)生改變?
(3)如果我們正在使用iPad Pro12.9’’(wR hR)進行UI布局,如果分類按鈕選了Height,那么對UI進行修改,請問會使哪些設(shè)備的UI產(chǎn)生改變?
(4)如果我們正在使用iPhone SE進行UI布局,如果分類按鈕選了Width,那么對UI進行修改,請問會使哪些設(shè)備的UI產(chǎn)生改變?
</br>
回過頭說自己寫此文的初衷,是因為當我掌握了上面的技術(shù)之后遇到了一個問題:我只打算在iPad版本上修改標簽,把字體變得大一些,卻使其他iPhone設(shè)備上的標簽也都變大了。這時候使用過濾器就沒有效果了,我們需要為標簽的字體Font增加一個(wR hR)的版本:

點擊Font屬性前的加號,點擊Add Variation


現(xiàn)在標簽的屬性Font有2行,一行是通用的Font,另一行帶有(wR hR)標簽的是針對特定尺寸的。特定會覆蓋通用,需要再添加一個(wC hR)、(wC wC)或(wR wC)都可以。如果沒有任何指定,就默認使用通用屬性。
細心可以發(fā)現(xiàn)標簽內(nèi)有大量可以指定尺寸進行設(shè)置的屬性:

還有更為徹底的,如果想指定尺寸選擇一個新的標簽控件,可以在控件屬性最下端,操作是類似的,左邊的加號指定尺寸,Installed表示通用:
