Issue with changing the color of the statusbar

Hey there,

I have an issue with changing the color of the statusbar. I already read many topic in this forum and I tried for several different code snippets with the statusbar plugin.

This is the following code in the src/app/app.component.ts:
import { Component } from ‘@angular/core’;
import { Platform } from ‘ionic-angular’;
import { StatusBar } from ‘ionic-native’;
import { LoginPage } from ‘…/pages/login/login’;

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  rootPage = LoginPage;

  constructor(platform: Platform) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.backgroundColorByName("red");

    });
    }
}

I also tried it with Hexcode (StatusBar.backgroundColorByHexString(’#FF0000’);), without the hashtag of the hexcode and turning on/off the overlaysWebView (StatusBar.overlaysWebView(true):wink: with no better result. The app still displays me only a black statusbar with white text on it.

Is app.component.ts the right place? Is the code correct? I try it with ionic serve (I guess there are some problems with Cordova) and I tried it by generating an apk file and start it on my android phone.

Cordova CLI: 6.0.0
Ionic Framework Version: 2.0.0-rc.5
Ionic CLI Version: 3.0.0-beta.4
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 10
Node Version: v6.9.2
Xcode version: Not installed

I hope somebody can help me :slight_smile: I would be very thankful :slight_smile:

Best regards
Kevin

1 Like

Same problem here

ordova CLI: 6.5.0
Ionic Framework Version: 2.1.0
Ionic CLI Version: 2.2.1

(ordova? :grin:)