[herb200mph]

Client has taken a strong liking to the splash screen that displays before the native app opening screen.

The splash screen displays only during the “first loading” of the app.

The splash screen does not display again once the app is installed and opened the first time.

How can we configure the app to display the splash screen every time the app is opened after installing?

[Brandon]

The splash screen is displayed each time the app is ‘opened’. If it has already been opened, and is in the background it may not show it again until it is completely closed. You can manually add something using the Phonegap API. The event Resume is called when the app is pulled from the background. So it would be easy to add a hidden panel with the same splash screen and only show this when the app is Resumed (not on opening). Here is the link to the API:

http://docs.phonegap.com/en/3.3.0/cordova_events_events.md.html#resume

to hide/show a panel or item:
//code untested, from the top of my head

$(‘#m1-formname-panel1’).css(‘visibility’,’hidden’); //hides it
$(‘#m1-formname-panel1’).css(‘visibility’,’visible’); //shows it

[herb200mph]

Can we just put a screen before Screen#1 that will fade out after 5-seconds, every time the app opens.

Can javascript be added to the Splash/Opening screen that will do that before Screen#1 is displayed.

[Brandon]

You can, but that wont get called if the app is in the background, then reopened as it is still on screen1 and not technically reopening it.

[herb200mph]

Right. Thanks for that.

[Brandon]

No problem. If you run into any trouble let me know.

[herb200mph]

Oh, its already trouble in that we are not coders and looking for a simple solution.

[Brandon]

Try this, in your custom.js file, make sure you change the form name and if needed the panel: (untested)

    document.addEventListener("deviceready", onDeviceReady, false);

    // device APIs are available
    //
    function onDeviceReady() {
        document.addEventListener("resume", onResume, false);
    }

    // Handle the resume event
    function onResume() {
    //show splash screen, an image in panel widget called panel1
     $('#m1-formname-panel1').css('visibility','visible'); //shows it
      setTimeout(function(){$('#m1-formname-panel1').css('visibility','hidden');},5000);
    }

[herb200mph]

Thanks a ton Brandon.

We will give this code a test in the next day or so and report back the results.

Cheers.

[Author]

Posts