Status bar is always white about cordova-plugin-statusbar HOT 10 CLOSED

That's not the status bar, is the safe area, if you want to get rid of it, add viewport-fit=cover to your viewport meta tag as a lot of people already commented.

But what should I do if I don't need cover, but just want to change color? In mobile safari this area has background-color of body tag. In cordova it's always white.

from cordova-plugin-statusbar.

Same Problem here.
However: This plugin partially fixed it for me: https://github.com/jcesarmobile/cordova-plugin-disable-ios11-statusbar

I would expect this to work with only this library.

Without Library:

from cordova-plugin-statusbar.

I fixed it doing this:
https://stackoverflow.com/a/46232813/751524

from cordova-plugin-statusbar.

@Dwarfex Exactly the steps that Stackoverflow response says.

from cordova-plugin-statusbar.

I have the same issue and I can't change the color of the status bar for any other color.
Just happens in iOS, in Android works.

from cordova-plugin-statusbar.

I also tried several "solutions" advised here: (https://stackoverflow.com/questions/46232812/cordova-app-not-displaying-correctly-on-iphone-x-simulator)

However "padding-top: env(safe-area-inset-top);" is not working for me as it does nothing to my layout.

I also noticed, that 'viewport-fit=cover' is not part of the displayed html anymore (altough part of the original html file) when inspected with Safari.

"cordova-ios": "^4.5.5",
"cordova-plugin-statusbar": "^2.4.2",
iOS 12 & 12.1
Cordova 8.0.0

from cordova-plugin-statusbar.

@utiq What exactly where the steps, that fixed it for you?

from cordova-plugin-statusbar.

Basically, you need to add splashscreen plugin to fix this issue @Dwarfex.
I was also having a weird issue using "window.cordova" before StatusBar, like window.cordova.StatusBar. This works well on Android, but not on iOS.

from cordova-plugin-statusbar.

@diegodotta I hoped so - but i already have added the plugin.

• I use viewport-fit=cover
• i use the splashscreen plugin with a "<splash src="res/screens/ios/Default@2x~universal~anyany.png" />" setting
  so my application looks like the second image on the stackoverflow link
  https://i.stack.imgur.com/VNFYb.png

But the variable "env(safe-area-inset-top)" seems to be "0" or not set as it has no effect on the layout. (even when used on simple divs)

from cordova-plugin-statusbar.

That's not the status bar, is the safe area, if you want to get rid of it, add viewport-fit=cover to your viewport meta tag as a lot of people already commented.

from cordova-plugin-statusbar.