Sencha app with cordova shows black screen on launch

Question

I have created few Sencha touch 2.3 apps and packaged them for Android and iOS using Cordova.

One issue that I have not been able to resolve is, when you launch the app, you will see a black screen after which your Splash screen appears. Has anyone managed to solve this issue? I would like to directly show the splash screen without the black screen in between. This happens on Android.

Also, even if you create a starter app using sencha app generate ... If you try to package that app, it takes minimum of 4 seconds before your view is loaded and displayed. Is there any way to speed up this? When the skeleton app takes 4 seconds to load, you can imagine other real apps that are bigger in size, they take 6-8+ seconds to load !

Answer 1

Use the splashscreen plugin from Cordova and hide it after 250ms of the launch of your app.

basically inside the app.js - launch:

    var browserEnv = Ext.browser.is;
    if (browserEnv.WebView && browserEnv.Cordova) {
        Ext.defer(function () {
            Ext.device.Splashscreen.hide();
        }, 250);
    }

Your problem with start time of the app:

I do not have this, as my empty apps start within 2 seconds therefore you might want to check on the size of your app and resources. What is the size of your apk. If it is larger than 0.45 MB for an empty you definately want to look into it.