无法更改$ cordovaStatusbar文本颜色

I'm having issues with the status bar of my Ionic app. More specifically I'm not able to change the bar default color, no matter what style I apply.

我的Ionic应用程序状态栏出现问题。更具体地说,无论我采用何种风格,我都无法更改条形默认颜色。

I already checked ngCordova and the cordovaStatusbar plugin are already installed correctly.

我已经检查过ngCordova并且cordovaStatusbar插件已经正确安装。

CODE SNIPPET

app.run(function ($ionicPlatform, $cordovaStatusbar) {

  $ionicPlatform.ready(function () {

        // Color the iOS status bar 
        if (window.StatusBar) {
            $cordovaStatusbar.overlaysWebView(true);
            $cordovaStatusbar.styleHex('#f50'); 
        }
    });
});

This is the result I get in xCode simulator with ionic emulate ios command.

这是我使用离子模拟ios命令在xCode模拟器中得到的结果。

EDIT:

After many tests I think the problem is more in depth. Neither .show() or .hide() methods are working.

经过多次测试后,我认为问题更深入。 .show()或.hide()方法都不起作用。

app.run(function ($ionicPlatform, $cordovaStatusbar) {

  $ionicPlatform.ready(function () {

        $cordovaStatusbar.hide(); //not hiding the status bar
    });
});

3 个解决方案

#1

From the plugin github page

从插件github页面

On iOS 7, when you set StatusBar.statusBarOverlaysWebView to false, you can set the background color of the statusbar by a hex string (#RRGGBB).

在iOS 7上,当您将StatusBar.statusBarOverlaysWebView设置为false时,可以通过十六进制字符串(#RRGGBB)设置状态栏的背景颜色。

So I got this working by doing the following:

所以我通过以下方式实现了这个目标:

Making sure ngCordova is installed

确保安装了ngCordova

Set OverlaysWebView to false and set the color.

将OverlaysWebView设置为false并设置颜色。

if(window.StatusBar) {
   $cordovaStatusbar.overlaysWebView(false);
   $cordovaStatusbar.styleHex('#FF0000') //red
}

#2

The text can only be white or black

文字只能是白色或黑色

This will use black color:

这将使用黑色:

$cordovaStatusbar.styleDefault();

Any of this will use white color:

任何一种都会使用白色:

$cordovaStatusbar.styleLightContent();
$cordovaStatusbar.styleBlackTranslucent();
$cordovaStatusbar.styleBlackOpaque();

That styles made sense before iOS 7, now they all do the same.

这些风格在iOS 7之前有意义,现在它们都是这样做的。

To change the statusbar color you have to set the overlaysWebView to false first.

要更改状态栏颜色,必须先将overlaysWebView设置为false。

$cordovaStatusbar.overlaysWebView(false);

If it's true it will be transparent and you won't be able to change the color.

如果它是真的它将是透明的,你将无法改变颜色。

#3

I had the same issue in one of the apps i am developing. The following plugin worked for us https://github.com/apache/cordova-plugin-statusbar

我在其中一个正在开发的应用程序中遇到了同样的问题。以下插件为我们工作https://github.com/apache/cordova-plugin-statusbar

if (window.StatusBar) {

            StatusBar.styleLightContent();
    }

Edit: for hiding the status bar you can use window.StatusBar.hide();

编辑:隐藏状态栏可以使用window.StatusBar.hide();

#1