android - PhoneGap/Cordova blank screen on pause/resume

Question

Welcome To Ask or Share your Answers For Others

android - PhoneGap/Cordova blank screen on pause/resume

asked Jan 31, 2022 in Technique[技术] by 深蓝 (71.8m points)

I have a simple html/javascript app that starts and works up fine on an Android device. However, when the app is put in background by using the 'home button' and then brought back to the foreground by clicking on the app again - it starts with a blank screen (white blank screen on android ) and stays that way until the 'back button' is pressed.

Once the 'back button' is pressed the screen refreshes to the last page displayed by the app.

I am new to PhoneGap and I am sure there is something simple/fundamental that I am missing - in terms of how to handle the 'resume' event/etc.. I have followed the instructions provided on this link by Phil Mitchell http://wiki.phonegap.com/w/page/35501397/Tutorials (which is a great resource btw..)

Thanks.

Update :

After looking at the DroidGap code, I have tried to add the following line :-

        super.setBooleanProperty("keepRunning", false);

But this does not seem to help. I am happy for the app to exit every time the home button is entered and then do a full restart when the app is clicked on the mobile.

Any help is much appreciated..

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

270 views

1 Answer

深蓝 · Answer 1 · 2022-01-31T07:13:29+0000

I was having the same problem and I want to share a hack that worked for me.

My app is based on ionic/angular/cordova and the android version was giving me a white screen around 50% the times on pause/resume.

When it happened, tapping anywhere on the screen or hitting the back button would make the screen to render again just fine.

I added a div tied to a scope variable named random, like this:

  <body ng-app="starter" id="body">
    <div>{{ random }}</div>
    <ion-nav-view>
    </ion-nav-view>
  </body>

Then I added a listener inside my app.js to capture the resume event fired by cordova, to then change the random variable and call $apply(), like this:

document.addEventListener("resume", function() {
  angular.element(document.querySelector('#body')).scope().random = Math.random();
  angular.element(document.querySelector('#body')).scope().$apply();
})

Since the ion-nav-view takes over the whole screen that div never shows up, but angular doesn't know that and refreshes the page, causing the whole thing to work.

(I tried to tie the variable to an invisible element but then angular doesn't refresh the page)

I hope this helps someone!

Categories

android - PhoneGap/Cordova blank screen on pause/resume

Please log in or register to add a comment.

Please log in or register to answer this question.

1 Answer

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags