通過SizeClass的方式,在StoryBoard中點擊如圖位置:
SizeClass_01.png
通過提示信息可以判斷適配屏幕類型:
默認模式:
![Uploading SizeClass_03_alliPhoneHorizontal_524183.png . . .]
適配所有手機橫屏模式:
SizeClass_03_alliPhoneHorizontal.png
適配所有手機豎屏模式:
SizeClass_03_allIphone.png
還可以針對5.5寸橫屏做專門的適配:
SizeClass_04_5.5Horizontal.png
選中需要適配的類型后點擊,進入該模式預覽,底部顯示藍色狀態:
SizeClass_04_horizont.png
當需要切換時,再次點擊切換適配屏幕類型即可
橫豎屏適配一般分為兩種情形:
1.橫豎屏下顯示控件一致,只是布局有所調整
- 這種情形實現簡單,只需要切換到需要適配的模式下(SizeClass(w Any& h Compact)),取消通用SizeClass下的約束,重新設置布局和約束就可以了
layout.png
這樣每個控件都有了兩套約束(分別在橫屏、豎屏下,所以不會沖突)
豎屏視圖:
SizeClass_02_vertical.png
橫屏視圖:
SizeClass_01_horizontal.png
2.橫豎屏下顯示控件不同,布局不同
- 這種情況一般是布局樣式區別比較大,可以設置兩套視圖,在橫豎屏下分別顯示不同視圖
選中視圖中的控件,在屬性檢測其下,有一處Installed的勾選項,如果勾選,就會在視圖顯示,如果取消勾選,就不會顯示在視圖上
SizeClass_6_Installed.png
需要注意的是:
- 在某個SizeClass下添加視圖: 在當前SizeClass的預覽樣式下直接添加,在其他的SizeClass下不會顯示,如果需要全部顯示,可以在通用模式下添加
- 如果直接取消勾選,在任何視圖下就都不會顯示了,對于不需要在當前SizeClass下顯示的視圖: 選擇該視圖,在屬性面板中添加當前SizeClass的屬性,去掉當前SizeClass的勾選
SizeClass_6_installed_setting.png
這樣設置后,才不會影響其他視圖下的顯示
豎屏視圖:
SizeClass_6_vertical.png
橫屏視圖:
SizeClass_6_horizontal.png
在不同的SizeClass下,不顯示的視圖控件會顯示成灰色
SizeClass.png
這樣雖然視圖設置OK了,但是會顯示約束警告
Constraint.png
因為不同視圖顯示控件不一致,比如這里在橫豎屏模式下,底部公用了一個View,約束不同,但是中心的View使用了不同的兩個View,這樣在橫屏模式下,使用了自己獨有的一個View,原本在豎屏模式下顯示的中心View設置為關閉,所以還需要把對應的約束也關掉
橫屏模式下,將在豎屏模式下才顯示的view的子控件約束關閉
Constraint_1.png
同樣還需要將豎屏模式下才顯示的View自身的約束也關閉
Constraint_2.png
這樣就不會出現警告了,因為只有在通用的視圖下添加控件,才會被都顯示出來,而在某一個SizeClass下添加的控件,不會被其他SizeClass顯示,所以在手動設置的橫屏SizeClass中,并不會影響豎屏模式下的視圖,也不會出現約束警告的問題.
當然如果不關閉未啟用控件約束也是不影響運行的,推薦還是將項目的警告減少到最少
