How to configure the StatusBarOverlaysWebView phonegap plugin to prevent the status bar from overlapping the app content

Question

I cannot get it to work. I have added the plugin to the directory via the phonegap CLI, and inserted:

<preference name="StatusBarOverlaysWebView" value="false" /> 

into config.xml in the ios platform block, but the status bar still overlays the content.

Answer 1

Install latest version of cordova statusbar plugin using the following command,

cordova plugin add cordova-plugin-statusbar

Add following lines in config.xml under ios platform section,

<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarStyle" value="default" />

Remove iOS platform, re-add and build the iOS platform again.