在离子2应用程序中更改iOS状态栏颜色

Question

我正在关注离子2文档以设置iOS状态栏颜色,但它无法正常工作.状态栏文本为白色,这意味着在我的白色背景上它是不可见的.

我在我的app构造函数中放入的代码是:

    StatusBar.overlaysWebView(true);
    StatusBar.styleDefault();

我使用以下方法导入了StatusBar:

import {StatusBar} from 'ionic-native';

我还检查了cordova s​​tatusbar插件是否已安装.

Answer 1

您可以尝试在config.xml中添加此项,并使用您要设置的颜色的十六进制值:

<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#000000" />

对于ngCordova或离子原生,您可以使用

  $cordovaStatusbar.styleColor('black');

  $cordovaStatusbar.styleHex('#000');

或者你检查状态栏cordova插件github页面有一些方法来改变状态栏的颜色:https://github.com/apache/cordova-plugin-statusbar

对于Android:

if (cordova.platformId == 'android') {
    StatusBar.backgroundColorByHexString("#333");
}

对于iOS

在iOS 7上,当您将StatusBar.statusBarOverlaysWebView设置为false时,可以按颜色名称设置状态栏的背景颜色.

StatusBar.backgroundColorByName("red");

支持的颜色名称是:

black, darkGray, lightGray, white, gray, red, green, blue, cyan, yellow, magenta, orange, purple, brown

或者
通过十六进制字符串设置状态栏的背景颜色.

StatusBar.backgroundColorByHexString("#C0C0C0");

还支持CSS速记属性.

StatusBar.backgroundColorByHexString("#333"); // => #333333
StatusBar.backgroundColorByHexString("#FAB"); // => #FFAABB
On iOS 7, when you set StatusBar.statusBarOverlaysWebView to false, you can set the background color of the statusbar by a hex string (#RRGGBB).

在WP7和WP8上,您还可以将值指定为#AARRGGBB,其中AA是alpha值