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 ionic checklist

Answer 2

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

Try with below code.

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

Answer 3

尝试使用：

<强> config.xml中 添加以下状态栏：

<preference name="StatusBarBackgroundColor" value="#FFFFFF" />

<强> app.run.js

if (window.StatusBar) {
  // cordova plugin org.apache.cordova.statusbar is used
  window.StatusBar.styleLightContent();
}

Answer 4

我认为你使用OnsenUI这将是问题...不是状态栏插件。试试ons.disableAutoStatusBarFill（）;解决问题;）

Answer 5

这似乎是Cordova处理iOS 11状态栏的方式的错误。作为修复，你可以把

    <meta name="viewport" content="viewport-fit=cover">

在index.html中

。