背景
有用戶反饋,在iPhone SE 2代 存在遮擋UI界面問題,經(jīng)過分析,發(fā)現(xiàn)用戶開啟了放大模式(Display Zoom -> Larger Font)導(dǎo)致實(shí)際顯示時屏幕大小與正常模式不同,所以導(dǎo)致部分UI遮擋。
各手機(jī)屏幕在正常模式和放大模式對比參考:
手機(jī)型號 | 正常模式 size | Larger Font Size | 備注 |
---|---|---|---|
iPhone SE2, iPhone 6, 6s, 7 和 8 |
375×667 | 320×568 | 等同于 SE 1/iPhone 5(s)代屏幕大小 |
iPhone X and XS等 | 375×812 | 320×693 | |
iPhone 11 Pro等 | 414×896 | 375×812 | 等同于iPhone X |
iPhone 12 mini等 | 360×780 | 320×693 |
也可參考:How iOS Apps Adapt to the various iPhone 12 Screen Sizes
解決方案
可以通過滑動或者選擇兼容屏幕來避免 UI 遮擋。
頁面支持滑動
對于常規(guī)頁面,都建議支持滑動,除非頁面內(nèi)容非常少。
常見的滑動方式:
- 直接使用 UITableView 作為基礎(chǔ)頁面底層 View.根據(jù)內(nèi)容定義各種 Cell。
- 使用 ScrollView + View 來支持滑動。
選擇對應(yīng)最小屏幕兼容
根據(jù)應(yīng)用正常模式要兼容的最小屏幕來考慮 Larger Font 的最新屏幕。比如,正常最小支持屏幕為 iPhone SE2代,如果想要完美兼容放大模式,應(yīng)該適配 iPhone SE 1代 屏幕大小。
綜上,建議非特殊頁面都支持頁面滑動,否則應(yīng)用考慮是否兼容 iPhone SE 1代。
UIScreem相關(guān)數(shù)據(jù)
幸運(yùn)的是可以通過UIScreen.main.bounds
獲取實(shí)際的屏幕大小(即實(shí)際顯示大?。呀?jīng)基本滿足日常開發(fā)和布局。
也可以通過以下代碼段判斷是否開啟了放大模式stackoverflow參考。
+ (BOOL)isZoom {
return UIScreen.mainScreen.scale < UIScreen.mainScreen.nativeScale;
}
正常數(shù)據(jù)文章來源:http://www.zghlxwxcb.cn/news/detail-668815.html
// 正常模式
(lldb) po main.bounds
(origin = (x = 0, y = 0), size = (width = 414, height = 896))
(lldb) po main.nativeBounds
(origin = (x = 0, y = 0), size = (width = 828, height = 1792))
(lldb) po main.nativeScale
2
(lldb) po main.scale
2
// 縮放版本 display zoom Larger Font文章來源地址http://www.zghlxwxcb.cn/news/detail-668815.html
(lldb) po main.scale
2
(lldb) po main.nativeScale
2.2080000000000002
(lldb) po main.bounds
(origin = (x = 0, y = 0), size = (width = 375, height = 812))
(lldb) po main.nativeBounds
(origin = (x = 0, y = 0), size = (width = 828, height = 1792))
(lldb)
到了這里,關(guān)于iOS 頁面布局兼容放大模式的文章就介紹完了。如果您還想了解更多內(nèi)容,請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!