iOS 8 by Tutorials(1.4自適應字型)

標籤：

1.4、自適應字型

使用定製的size classes使得當前的文字大小在iPad上能很好的顯示，但是在緊湊的size classes上還是太大。不要擔心——通過size classes還是能夠覆蓋（相容）文字大小。

注意：和布局覆蓋不一樣，改變字型配置會影響基礎布局，在IB更改字型配置不會遵守當前的size classes，相反，需要使用如下方法

重新選擇Any Width ｜ Any Height的Size Class，下面的欄會立即變灰——這是因為你回到了基礎布局。

選擇Cupertino label，開啟Attributes Inspector，點擊Font左邊的＋： 

這時會出現新的字型size class組合，選擇Compact Width > Any Height： 

這將建立第二個字型選擇框來應用到特別的size class組合，將新的字型選擇框設定為90： 

現在使用相同的流程來設定溫度label，設定Compact Width > Any Height下的字型大小為150。

介面立即起到了作用而變成這樣：咯嘰咯嘰 

很好！看起來好了一點，但是Cupertino卻省略了一部分，修正字型大小直到它不是特別的伸縮。Cupertino是一個很長的地名，但是Washington, D.C.更長，還有Kleinfeltersville, PA會更長，我們該怎麼設計啊！！

 

再一次，自動布局又來救援你了！ 你僅僅需要限制兩個label的寬度匹配在TextContainer的寬就好了，Ctrl－drag``Cupertino到TextContainer，然後選擇Equal Widths。重複相同的步驟來設定溫度label： 

嗯哼，這些顯示不全的文本也不是你想要的，這是label預設屬性——可用的空間顯示不了多餘的文字 造成的。然而它也有其他的選項來解決這個問題——在可用的空間來改變字型來自適應。

選擇Cupertino開啟Attributes Inspector，修改AutoShrink為Minimum font scale並設定值為0.5，並且將Text Alignment改為Centered，如所示： 

重複相同的步驟來設定溫度label。

來看看預覽窗格吧，在iPhone的布局上看起來好多了： 

運行在預覽編輯器上會更好，但這可能是在一切仍正常運行下，是一個好辦法構建和運行你的項目,在iPhone螢幕上看起來大小很合適： 

然而在iPad上看上去cloud image可笑的變小，特別是在豎屏下： 

這是因為你使用了相同的圖片顯示在iPad和iPhone上。在下節中你會學到在iPad中來改善圖片大小。

iOS 8 by Tutorials(1.4自適應字型)