ionic status bar 상태바 추가

STEP1
플러그인 설치

ionic cordova plugin add cordova-plugin-statusbar 
npm install @ionic-native/status-bar 

 

STEP2

app.module.ts

모듈에 사용할 플러그인 기재

import { StatusBar } from '@ionic-native/status-bar/ngx';



  providers: [

    StatusBar,

  ]

 

STEP3

app.component.ts

모든 페이지에 적용해야하니 app.components에서 소스 적용

import { StatusBar } from '@ionic-native/status-bar/ngx';

  constructor(

    private statusBar: StatusBar

  )

{

    this.initializeApp();

}





  initializeApp() {

    this.platform.ready().then(() => {

      this.statusBar.styleDefault();

      this.statusBar.overlaysWebView(true);

      this.statusBar.backgroundColorByHexString('#000000');

      this.statusBar.show();

      this.splashScreen.hide();

    });

  }

 

backgroundColorByHexString 부분은 테마에 따라 #ffffff 흰색 또는 #000000 으로 적용