Perminant white overlay on IOS (Phonegap build 3.1.0)

  • 12
  • Problem
  • Updated 6 years ago
  • In Progress
I have a permanent white overlay in phongap 3.1.0 in IOS, when i rotate the phone and rotate it back it covers half the screen.

I don't think it has anything todo with splashscreen because te overlay stays.

Ik has to be someting in the webview (css), how can i fix this?

Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes

Posted 7 years ago

  • 12
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Android works fine, no problems
Photo of ismael jimoh

ismael jimoh

  • 4116 Posts
  • 192 Reply Likes
Hi Wouter,

Which version of iOS are you testing this on and does this occur if you test it on PhoneGap build 2.9?

Do send me your app id so I can have a look at this.

Ismael
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Hi Ismael,

Thx for your reply, i installed my .ipa on iOS 7.0.3
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Hi Ismael again,

In just tested on phonegap 2.9.0 and it works fine, no problems there either!

My appid in build is: 608739

Thx!
Photo of Tim Barton

Tim Barton

  • 6 Posts
  • 1 Reply Like
I added this to my project cordova plugin add org.apache.cordova.statusbar then I modified my config.xml to



You can hide the statusbar. See this page for example. https://github.com/apache/cordova-lab...

This is not an issue with anything below IOS 7

Tim
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Sorry Tim, what do you mean? I don't want to hide the statusbar i just want this issue resolved! Any other suggestions? Thx
Photo of Eddy Verbruggen

Eddy Verbruggen, Champion

  • 375 Posts
  • 86 Reply Likes
Hi,

I have the exact same issue as Wouter with this app which is based on the default CLI generate iOS app:
https://github.com/EddyVerbruggen/X-S...

The issue is not there on PhoneGap 3.0.0, only on 3.1.0 and likely caused by a statusbar fix on Build (which is by default visible on 3.1.0).

When rotating to landscape, the screen goes blank. When rotating back to portrait, the right side of the screen is blank.
Photo of Tim Barton

Tim Barton

  • 6 Posts
  • 1 Reply Like
My Apologies. My tag was removed. But just add the plugin org.apache.cordova.statusbar and add the below to your config.xml Make sure onload is set to false.

Tim



<feature name="StatusBar">
<param name="ios-package" onload="false" value="CDVStatusBar" />
</feature>
Photo of Tim Barton

Tim Barton

  • 6 Posts
  • 1 Reply Like
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Tim, this is a bug in Phonegap 3.1.0, i don't want to hide the statusbar!
Photo of Eddy Verbruggen

Eddy Verbruggen, Champion

  • 375 Posts
  • 86 Reply Likes
Hiding or showing the statusbar via the plugin will not solve the problem. It's in the core 3.1.0 code of Build. Just tested it to make sure.
Photo of Tim Barton

Tim Barton

  • 6 Posts
  • 1 Reply Like
My Apologies again. I don't know if it is a bug but seems to be how apple designed this in IOS7.

http://blog.jaredsinclair.com/post/61...

Nevertheless, I was able to get rid of the overlay during splash and when the application is shown. If you want to keep the statusbar, Apple/Phonegap will have to find a solution to this.

What I did was check the "Hide during application launch" for Status Bar Visibility under summary for the application.

Then in CDVStatusBar.m Change _statusBarOverlaysWebView to NO.

Clean then run/install. I use testflightapp.com to install on devices.

Tim
Photo of ismael jimoh

ismael jimoh

  • 4116 Posts
  • 192 Reply Likes
Hi Wouter,

Sorry for the late reply.

We are looking into this now.

Ismael
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Thx Ismael, great!
Photo of Eddy Verbruggen

Eddy Verbruggen, Champion

  • 375 Posts
  • 86 Reply Likes
Photo of Austin Knobloch

Austin Knobloch

  • 6 Posts
  • 0 Reply Likes
What did Bob do to fix it?! I am having this same issue with my app in 3.1.0. The issue just says "Closed", I am not able to view the resolution...
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
The issue is only partially fixed, stil have the big white border (piece of webview) visible at the top!



Could you have another look at this?
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
This is how it looks in Phonegap 3.0.0, the way it should be!


I hope someone wil resolve this issue forgood, thank you!
Photo of ismael jimoh

ismael jimoh

  • 4116 Posts
  • 192 Reply Likes
Hi Woulter,

I would look into this.

Thanks for bringing this to our attention and sorry for the trouble it may have caused you.

Ismael
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Thx Ismael, hope the issue wil be solved, I'm using 3.00 for now. Keep me posted please? Thx again!
Photo of Abe

Abe

  • 87 Posts
  • 3 Reply Likes
I also experience the same problem, as mentioned in this thread http://community.phonegap.com/nitobi/...
Photo of Duc Anh Nguyen

Duc Anh Nguyen

  • 2 Posts
  • 0 Reply Likes
This reply was created from a merged topic originally titled
Gap below iPhone status bar in phonegap build 3.1.0.


Hi,

I'm having a problem with the blank space between my content and the status bar

My test phone is iPhone 3GS, iOS 6.1.3. I used phonegap start available from github, change few attributes in config.xml such as:

phonegap-version : 3.1.0
fullscreen: false

Is anyone having the same problem ? I'm looking forward for your answers.

Thank you so much for looking into it.
Photo of ismael jimoh

ismael jimoh

  • 4116 Posts
  • 192 Reply Likes
Hi Doc,

We are currently looking into resolving this issue.

Sorry for the trouble this may have caused.

Ismael
Photo of Amir

Amir

  • 8261 Posts
  • 263 Reply Likes
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
This is still not fixed PhoneGap! Waiting for over almost 2 weeks now!
Photo of Bob Easterday

Bob Easterday

  • 174 Posts
  • 14 Reply Likes
@Wouter - I just retested on PhoneGap Build and I am no longer able to reproduce the issue as described. Can you provide your PhoneGap Build App ID?

Its the number you see in the URL when your app is active on PhoneGap Build.

ex. https://build.phonegap.com/apps/xxxxx....

I need the xxxxxx portion. - thanks!
Photo of Scott Bolinger

Scott Bolinger

  • 16 Posts
  • 2 Reply Likes
Hi, I'm experiencing this issue with app 637600
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Hi Bob, the issue is still here, my Build App ID is 608739, tested on iOS 7.0.3

See the Big white border at the top in Phonegap 3.1.0, and now build the app in 3.0.0. See the difference? 3.00 is fine, 3.1.0 is not looking good!

Ik hope the issue will now be solved forgood, thank you very much!

Photo of Bob Easterday

Bob Easterday

  • 174 Posts
  • 14 Reply Likes
@Wouter - Can you tell me what iOS version you are running on the device used in your picture?
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Ios 7.0.3 iphone 4s
Photo of Bob Easterday

Bob Easterday

  • 174 Posts
  • 14 Reply Likes
Now thats strange. The image shows the old style status bar, and I'm not seeing the issue on my iPhone 5 with iOS 7.0.3.....still investigating.
Photo of Wouter Bothoff

Wouter Bothoff

  • 35 Posts
  • 0 Reply Likes
Strange indeed, the top white bar is fixed when you scroll then the content dissapears behind it. Tested it with an iPhone 4s also?

In Android (Galaxy S4) when you exit the app via the home button you also see a piece of the webview, at the bottom (just before exit)