iOS Phonegap中的白色状态栏？

Question

如何在Phonegap 3.1.0 for iOS7中使用白色文本制作顶级状态栏半透明？

应用程序在移动Safari中看起来很好,但是当我尝试在Phonegap中运行它时顶部栏中的文本仅在应用程序加载时为白色,之后无论我在项目配置中设置什么设置它都是黑色的.

现在<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">网页上有'状态栏样式'='黑色半透明'在XCode中...没有帮助.

请帮忙!

Answer 1

您可以在没有任何元标记或在XCode中编辑任何内容的情况下执行此操作

首先,通过CLI安装statusbar插件:

cordova plugin add cordova-plugin-statusbar

然后,您可以使用这些首选项设置状态栏的样式(在config.xml中):

<preference name="StatusBarOverlaysWebView" value="true" />
<preference name="StatusBarStyle" value="lightcontent" />

这将为您提供iOS 7中带有白色文本的透明栏.有关其他选项,请查看http://plugins.cordova.io/#/package/org.apache.cordova.statusbar

Answer 2

最后,我找到了解决方案.

确保您有以下内容:在您的index.html上有以下元标记:

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

在Xcode中,打开[YourPrjectName] .plist并添加以下行:

"状态栏样式"="透明黑色样式(alpha为0.5)"和
"查看基于控制器的状态栏外观"="否"

没有第二行将无法工作(实际上,这是我的问题).

Answer 3

添加这个

function onDeviceReady() {
  if (parseFloat(window.device.version) === 7.0) {
      document.body.style.marginTop = "20px";
   }
 }

document.addEventListener('deviceready', onDeviceReady, false);

iOS7状态栏问题

http://coenraets.org/blog/2013/09/phonegap-and-cordova-with-ios-7/