解決uni-app開發中iphoneX下背景不能全屏鋪滿的問題

使用原生佔位(僅App端支持)

mainfest.json 文件 app-plus 節點下配置 safeareacss

"safearea": { "background": "#CCCCCC", "bottom": { "offset": "auto" } } 

不使用原生佔位(非App端能夠不配置mainfest)

mainfest.json 文件 app-plus 節點下配置 safeareaandroid

"safearea": { "bottom": { "offset": "none" } }

而後在須要適配的頁面內使用 css 常量 constant(safe-area-inset-bottom)、env(safe-area-inset-bottom) 來適配,參考:爲iPhoneX設計網站。微信小程序模擬器不支持,以真機爲準。web

好比爲列表底部添加內邊距避開安全區,在 iPhoneX 上列表底部會有內邊距,在其餘設備上沒有內邊距:json

<style> .list { padding-bottom: 0; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom);  
}  
</style>

安卓全面屏底部安全區背景色修改方式

使用Native.js修改:小程序

var Color = plus.android.importClass("android.graphics.Color"); plus.android.importClass("android.view.Window"); var mainActivity = plus.android.runtimeMainActivity(); var window_android = mainActivity.getWindow(); window_android.setNavigationBarColor(Color.GREEN); 
相關文章
相關標籤/搜索