Ionic 2 - Status Bar

Question

I am unable to change the color of my Status Bar with Ionic 2. I have checked the documentation and am doing the following.

app js.

import {StatusBar} from 'ionic-native';

app.js (constructor())

platform.ready().then(() => {
  StatusBar.overlaysWebView(true);
  StatusBar.backgroundColorByHexString(#f69c55);
});

Answer 1

The configuration is correct. However, my device was Android 5.0 and the Stautsbar works only in later versions, as specified in the documentation.

This installation method requires Cordova 5.0+

Answer 2

If you refer to Toolbar I managed by adding my style in the file /src/theme/global.scss

//------- TOOLBAR //-------
    .toolbar-title-md, .bar-button-default-md, .bar-button-clear-md-default, .bar-button-md-default, .toolbar-title-ios {
        color: color($colors, minhaCor);
    }
    .toolbar-background-md, .toolbar-background-ios {
        background: none;
        border-color: transparent;
    }

Answer 3

StatusBar.backgroundColorByHexString(#f69c55);

This form is incorrect, because the documentation has to be a 'STRING' value. The right way to use it is:

StatusBar.backgroundColorByHexString('#f69c55');

Answer 4

http://ionicframework.com/docs/v2/native/Status%20Bar/ The documentation makes the following observation:

Set the status bar to a specific Hex color (CSS shorthand supported!).

iOS note: you must call Statusbar.overlaysWebView(false) to enable color Changing.

Your ta true

Answer 5

Exchange the true for false that will work!