ios - IphoneX 屏幕未覆盖科尔多瓦项目中的页眉和页脚
问题描述
我的应用程序与 iPhoneX 不兼容,搜索了很多并尝试了很多不同的东西。初始屏幕在每个设备上都显示得很好,但内部屏幕没有覆盖页眉和页脚。使用建议制作全屏的相同图像尺寸。还在 head 标记中使用元标记 index.html 文件中的视口。
在我的科尔多瓦项目中使用科尔多瓦 7.1.0 和 ios 4.5.4 版本,该应用程序在所有设备上运行良好,但与 iPhoneX 屏幕不兼容。当在模拟器中的 iphonex 上运行项目时,它在页眉和页脚上留下了空白。
在 index.html 文件的 head 标记中使用下面的图像大小和 meta 标记。
<splash platform="ios" src="res/screens/ios/750x1334.png" />
<splash platform="ios" src="res/screens/ios/1242x2208.png" />
<splash platform="ios" src="res/screens/ios/1278x732.png" />
<splash platform="ios" src="res/screens/ios/1334x750.png" />
<splash platform="ios" src="res/screens/ios/1334x1334.png" />
<splash platform="ios" src="res/screens/ios/2208x1242.png" />
<splash platform="ios" src="res/screens/ios/2208x2208.png" />
<splash platform="ios" src="res/screens/ios/2732x2732.png" />
和 head 标签中的元标签:
解决方案
启动屏幕/启动屏幕
完成 iOS 构建后转到 ->
Projectpath -> Platform ->iOS ->Open Project in Xcode
在 Xcode 中
ProjectName -> Resources -> Images.xcassets -> LaunchImage
标题:
添加 Cordova 状态栏插件
cordova plugin add cordova-plugin-statusbar
config.xml
在配置文件中添加以下首选项
<preference name="StatusBarBackgroundColor" value="#00458D" />
<preference name="StatusBarStyle" value="blacktranslucent" />
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarDefaultScrollToTop" value="false" />
页脚:
在每个 .html 页面中,在标签内添加以下<head>
代码
<meta name="viewport" content="viewport-fit=cover, initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width" />