顶部的 Cordova iOS 白条

Question

将 StatusBarOverlaysWebview 添加到 config.xml 后，我在屏幕顶部看到一个白条，所有内容都被向下推（参见屏幕截图 - 状态栏顶部有一个白条）。因此，它不仅将状态栏高度 (20px) 添加到屏幕上，还添加了 40px。

我仔细检查了我所有的样式，一切看起来都很好，所以我猜它是由插件引起的。谁能告诉我如何解决这个问题？

这是我的配置：

<preference name="StatusBarOverlaysWebview" value="false" />
<preference name="StatusBarBackgroundColor" value="#FF543E" />
<preference name="fullscreen" value="true" />

这是没有设置颜色和使用 window.StatusBar.overlaysWebView(false) 的样子；而不是 config.xml

Answer 1

试试这个，下面的代码对我有用：

<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#2D81C1" />
<preference name="Fullscreen" value="false" />

如果您仍然有问题，并且在之前的版本中使用相同的代码，请检查插件是否已安装并正常工作

更新：对于 iOS 11 和 iPhone X，库和 HTML 元标记有一些变化

在 index.html 中将元标记更改为：

<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

请更新 ionic-angular 库以获得最新的设备支持

更多信息：iOS 11 离子清单

Answer 2

这个东西在我的应用程序中使用状态栏插件为我工作。

Try with below code.

 <preference name="StatusBarOverlaysWebView" value="false" />
 <preference name="StatusBarStyle" value="lightcontent" />
 <preference name="StatusBarBackgroundColor" value="#FF543E" />