In some cases, we want to hide the status bar while developing our app. Here we will show you how can we hide the status bar with Ionic 2.
To hide status bar, we need to import the following libraries.
import { Platfrom, App } from 'ionic-angular';
import { StatusBAr } from 'ionic-native';
We can add these codes to hide the status bar in our constructor.
constructor(private platform: Platform){
this.platform.ready().then(() => {
StatusBar.hide();
document.addEventListener('resume',()=>{
StatusBar.hide();
});
});
}
Because in some cases, when we switch to another app, and switch back to our app, the status back comes back. So I would suggest you to add an EventListener
to hide StatusBar
when resuming.
Until now, it seems that the native Ionic 2 resume listener (platform.pause.subscribe(()=>{ /* TODO */});
) hasn’t been implemented. I would recommend you to use native Ionic 2 event listener
Before using fullscreen, you should launch this command in you Terminal to install Cordova’s fullscreen plugin
cordova plugin add cordova-plugin-fullscreen
After installing the Cordova plugin, insert <preference name="Fullscreen" value="true" />
to you config.xml in <platform></platform>
<platform name="android">
...
<preference name="Fullscreen" value="true" />
...
</platform>