iPhoneX 等刘海屏手机的适配方案之一

本博客提出的解决方案是，开启沉浸式状态栏。

APP打包使用工具Hbuilder

配置 manifest.json 配置文件

（一）plus配置: 添加 statusbar launchwebview

"plus": {"statusbar": {"immersed": true /*开启沉浸式状态栏*/},"launchwebview": {"statusbar": {"background": "#51A7FE" /*设置状态栏的颜色，一般是跟头部的颜色一样*/}},
}

（二） 如果 apple 中配置 UIReserveStatusbarOffset 需注释

 "apple": {/* "UIReserveStatusbarOffset":false */
},

（三）如果 google 中配置 ImmersedStatusbar 需注释

"google": {/* "ImmersedStatusbar":true, */
},

结束语

关于iPhone X的适配问题，还有其他的解决方案，如:

最粗糙的做法，直接在meta标签，改变viewport-fit值。viewport-fit=auto、viewport-fit=contain.代价是：你的状态栏是默认系统颜色，而不是你APP的颜色。

通过设置viewport-fit=cover，padding: constant(safe-area-inset-top) constant(safe-area-inset-right) constant(safe-area-inset-bottom) constant(safe-area-inset-left);

最后，大吉大利，今晚没bug!

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！