iOS 之Size Class

一.iPhone屏幕尺寸簡介

iPhone 4s
屏幕尺寸: 3.5英寸
分辨率:960 * 640

iPhone 5/ iPhone 5s / iPhone 5c / iPhone SE
屏幕尺寸: 4.0英寸
分辨率:1136 * 640

iPhone 6/ iPhone 6s / iPhone 7
屏幕尺寸: 4.7英寸
分辨率:1334 * 750

iPhone 6 plus / iPhone 6s plus / iPhone 7 plus
屏幕尺寸: 5.5英寸
分辨率:1920 * 1080

iPhone發展在4s之前,iPhone主流的屏幕尺寸是在3.5英寸,隨著iPhone的發展,隨后依次出現了大尺寸的屏幕的設備,隨之而來的帶給開發者的問題就是,如何一整套界面,來適配所有尺寸的屏幕呢,當屏幕切換的時候,怎么解決該橫屏切換豎屏的問題。這一點蘋果為開發者提供了解決的辦法。
Size Class 尺寸類別

二. Size Class的應用

iOS開發中,UI控件的約束的創建是對開發人員最基本的步驟。適配橫屏,豎屏的時候,通過蘋果提供的Size Class可以通過一組UI控件,在不同的屏幕下,使用不同的約束,已達到不同的效果等。

Xcode 8 可視化界面,下方展示出了在各個設備下控件的顯示狀態,進行預覽。


不同尺寸設備&屏幕方向顯示UI控件

可以觀察到wR hC這樣的顯示
W為Width;H為Height;R為Regular;C為Compact
iPad的Size Class 為 wR hR
iPhone 豎屏 wC hR
iPhone 橫屏 wC hC
iPhone 橫屏 wR hC (plus機型)
通過不同的Size Class可以在添加不同的約束的時候,指定該約束在不同的Size Class中可以使用,從而使得讓一組UI控件,適配了不同的尺寸的設備。

三.Demo練習

在設備豎屏狀態下顯示的標簽


設備豎屏狀態下顯示

在plus設備橫屏狀態下顯示的標簽

Plus機型橫屏狀態下顯示的標簽


plus機型橫屏狀態下顯示

非plus機型顯示的標簽


非plus機型橫屏狀態下顯示
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容