htmlextjssencha-touchsencha-touch-2

Sencha touch splash screen issue


I'm Working with a Sencha Touch application.

in starting of application there are three parts,
1.Splash screen of iphone
2.White screen (that comes from body tag of index.html)
3.application first page

now, i have issue with splash screen and white screen.
i want to remove white screen,display only one single splash screen than application first page.

also, there is slight white blink between splash screen and white screen.

is there any solution for this two issues ?

i have tried different solution as follow,
1. is there any solution for completely remove iphone splash screen ? then, instead of white screen i displayed splash screen of application.
2. or remove white screen and display directly application first page after splash screen.

any help will be appreciated.
Thanks in advance.


Solution

  • Phonegap allows you to delay the hiding of "native" splash screen to the moment where your application is actually ready to show something.

    Check their docs on Splashscreen:

    For iOS:

    The config.xml file's AutoHideSplashScreen setting must be false. To delay hiding the splash screen for two seconds, add a timer such as the following in the deviceready event handler:

    setTimeout(function() {
        navigator.splashscreen.hide();
    }, 2000);
    

    If using Phonegap is not an option, you can still style your index.html with a background image to make it look the same as the splash screen (or very close). Look out for two things:

    1. There could be a gap between the native splashscreen and your index.html due to the statusbar: native splashscreen height is your webview height + statusbar height

    2. You have to handle the styling of index.html taking into account orientation changes