【问题标题】:White status bar in iOS Phonegap?iOS Phonegap中的白色状态栏?
【发布时间】:2013-12-02 10:52:36
【问题描述】:

如何在 iOS7 的 Phonegap 3.1.0 中用白色文本使顶部状态栏半透明?

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

现在在网页中有 <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> 和 XCode 中的 'Status Bar Style' = 'Black Translucent'... 没有帮助。

请帮忙!

【问题讨论】:

    标签: ios xcode cordova statusbar


    【解决方案1】:

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

    首先,通过 CLI 安装状态栏插件:

    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

    【讨论】:

    • 这应该是推荐的答案,因为它更易于维护。
    • 所有插件都重命名了,所以现在应该是cordova plugin add cordova-plugin-statusbar
    • blacktranslucent 对我不起作用,但 default 对我起作用并且状态栏变成黑色半透明
    【解决方案2】:

    终于找到了解决办法。

    确保您具备以下条件: 在您的 index.html 有以下元标记:

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

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

    “状态栏样式”=“透明黑色样式(alpha of 0.5)”AND
    "查看基于控制器的状态栏外观" = "NO"

    没有第二行将不起作用(实际上,这就是我的问题)。

    【讨论】:

    • 很遗憾,对我不起作用——状态栏仍然是透明的,带有黑色文本
    • 是的,解决了在 iOS 7 中完美显示状态栏后的白色状态栏问题:stackoverflow.com/a/18886468/706751
    • 我实际上不得不使用 Xcode 更改 MainViewController.xib 文件中的设置 - 第 4 个 tabicon(看起来像滑块的那个,在标尺的右侧)有像 Size 这样的选项,方向,状态栏,顶部栏等 - 在这些下方,在色调颜色选项的正上方,是背景 - 将其更改为黑色! :)
    【解决方案3】:

    如果你使用phonegap build,你可以调用

    StatusBar.styleLightContent();
    

    https://github.com/phonegap-build/StatusBarPlugin

    【讨论】:

      【解决方案4】:

      看看下面的链接,希望对你有帮助。

      http://devgirl.org/2014/07/31/phonegap-developers-guid/

      【讨论】:

      • Chrome 说该网站包含恶意软件
      【解决方案5】:

      可能为时已晚,但有相同问题的其他人可以通过安装以下插件来解决此问题。

      cordova plugin add cordova-plugin-disable-ios11-statusbar --save

      然后构建并运行应用程序,问题将得到解决

      【讨论】:

        【解决方案6】:

        添加这个

        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/

        【讨论】:

        【解决方案7】:

        我想一个更新的答案可能会对这里的人有所帮助,这适用于 cordova 3.7+ 和 iOS 8.x,并且不需要额外的插件。

        在项目的 plist 文件中,确保“状态栏最初是隐藏的”和“基于控制器的状态栏外观”都设置为“否”

        然后,在 MainViewController.m 中,- (void)viewDidLoad 内添加:

        [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent animated:YES];
        

        [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleDefault animated:YES];
        

        状态栏中的白色或黑色文本。

        或者完全隐藏,将上面的两个 plist 属性设置为 YES,这似乎可以隐藏它。

        【讨论】:

          猜你喜欢
          • 2017-11-23
          • 1970-01-01
          • 2017-02-22
          • 1970-01-01
          • 2017-05-30
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2016-02-22
          相关资源
          最近更新 更多