I'm trying to change the color of the native status bar in an ionic app, but I can't get it to work. I've installed cordova-plugin-statusbar, and it installs fine. The following code works perfectly:
if (StatusBar) {
StatusBar.hide();
}
But trying to use any other of the available functions, for example:
if (StatusBar) {
StatusBar.backgroundColorByHex('#RRGGBB');
}
doesn't work, the just app uses the standard statusbar.
I've also added <preference name="StatusBarOverlaysWebView" value="true" />
to config.xml, as well as setting it programmatically at runtime.
Cordova is version 5.1.1, Ionic is version 1.5.5 and I'm using Android 21 for testing. Has anyone experienced the same problem or know how to fix it?
Could you try removing the status bar plugin and reinstalling like so:
ionic plugin rm org.apache.cordova.statusbar
ionic plugin add https://github.com/apache/cordova-plugin-statusbar.git
The same has been reported at the ionic issue tracker
See me original solution at Can't get cordova-plugin-statusbar to set color on Android
Add the plugin. Run shell command:
$ cordova plugin add cordova-plugin-statusbar
Edit your config.xml:
<preference name="StatusBarOverlaysWebView" value="true" />
<preference name="StatusBarBackgroundColor" value="#BE1912" />
'#BE1912' is the default color (on app starts).
Change in run time from your java script code:
if (window.cordova && StatusBar)
{
StatusBar.backgroundColorByHexString('#BE1912');
}
Gil's solution doesn't work for me (I've a Samsung Galaxy S7 Edge).
onDeviceReady: function () {
app.receivedEvent('deviceready');
console.log(StatusBar);
if (window.cordova && StatusBar) {
StatusBar.backgroundColorByHexString('#BE1912');
}
},