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
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.
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