How to chage the position of status bar

ionic-v1
1

How to chage the position of status bar like the small image show.

My config.xml setting is:

    <preference name="fullscreen" value="true" />
    <preference name="webviewbounce" value="false" />
    <preference name="UIWebViewBounce" value="false" />
    <preference name="DisallowOverscroll" value="true" />
2

You mean you want the nav-bar to be lower so it doesn’t override the Apple status bar?

Do you have the device plugin installed? Ionic won’t do this properly if you don’t have the Cordova device plugin installed.

https://github.com/apache/cordova-plugin-device/blob/dev/doc/index.md

cordova plugin add org.apache.cordova.device

3

Yeah, I have installed the device plugin:

cordova plugins ls
[  'org.apache.cordova.console',
  'org.apache.cordova.device',
  'org.apache.cordova.statusbar' ]

you mean I should use javascript to change the css of nav-bar according to the device version?

4

No, you shouldn’t have to do that. Ionic takes care of it automatically. Can you post a code sample?

Questions :

  • Ionic Version
  • Device Version
  • Cordova / PhoneGap version
5

@Calendee More in general, does Ionic take care of any possible css element I add to my app.css file?

6

I’m not sure what you mean by that. If you have a specific question, it’d be best if you opened a new forum topic.

7

Will do, thanks anyway.