Because of an Ionic 2 application, the status bar does not change?

0

How about, I would like to know why the status bar of an ionic 2 app, does not apply the style of material designer, like other app. Or do you have to add some plugin for this to happen? If someone knows, I appreciate it

    
asked by JuanL 26.01.2018 в 22:31
source

2 answers

2

The status bar is set to Ionic in the following way:

  • Install the plugin dependencies status bar Ionic native .

  • Verify that it is correctly added in the providers of ~/src/app/app.module.ts :

    import { StatusBar } from "@ionic-native/status-bar";
    ...
    providers: [StatusBar]
    ...
    
  • In the file ~/src/app/app.component.ts add in platform.ready() the following:

    ...
    import { StatusBar } from "@ionic-native/status-bar";
    
    @Component({
      templateUrl: "app.html"
    })
    export class MyApp {
      ...
    
      constructor(statusBar: StatusBar) {
        platform.ready().then(() => {
          statusBar.styleLightContent();
          statusBar.backgroundColorByHexString("#3c5ed5");
          ...
        });
      }
    }
    
  •   

    statusBar.styleLightContent() is to change the color of the icons to white, in case the color needs it, if this method is omitted the icons will be dark gray.

    Status Bar plugin documentation

        
    answered by 29.01.2018 / 16:56
    source
    1

    By rule when creating an application with the ionic cli, you already add the Cordova's StatusBar plugin.

    github.com/apache/cordova-plugin-statusbar /

    Once added, simply add the color you want in the StatusBarBackgroundColor tag in your config.xml file

        
    answered by 28.01.2018 в 23:16