Header Style - Dark clashes with iOS status/information

1

How do I go about ensuring that the correct text colour is applied to the header information in iOS? By this I mean the Network Provider, Time and Battery Info.

<ion-header-bar class="bar-dark">
    <h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>

This works as it should, applying the darker header with white text. However now I cannot see the iOS information, since that font colour is also black.

This doesn’t matter on Android, as the status bar doesn’t change colour.

2

In your project level config.xml, which is a cordova file you should add this

<preference name="StatusBarBackgroundColor" value="#ffffff" />

This will change the color of the device info to white.

3

Will this preference change take affect on the emulator the same way it does on the device?

4

Yeah, it works on the simulator as well.

5

I have tried this on my app and the sample sidemenu app and can’t seem to make it work.I have not tested on a device yet.Any ideas?

6

I forgot to install the plug in. Now it works