Worklight App Splash Screen on Android

Question

I am using Worklight for an Android application,

When I try to add a splash screen

public class MyApp extends WLDroidGap {
    @Override
    public void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       super.setIntegerProperty("splashscreen", R.drawable.splash);
       super.loadUrl(getWebMainFilePath(),2000);
    }       
}

I see the splash screen, but then, I have a black screen and the app crashes to be accurate, it shows a black screen, and when I tap on options button, it crashes

When I remove the ",2000"

public class MyApp extends WLDroidGap {
    @Override
    public void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       super.setIntegerProperty("splashscreen", R.drawable.splash);
       super.loadUrl(getWebMainFilePath());
    }       
}

I don't see the splash screen, and the app works.

I see that someone talked about that in IBM forums

And there are many blog posts talking about splashsccreens for Android with PhoneGap here and here, but I dont see a solution in these posts to my problem

Here are the app log after the crash:

I/SurfaceFlinger(   93): [SurfaceFlinger] frames:2, duration:2.262000, fps:0.883908
I/InputDispatcher(  246): channel '426b7be0 NavigationBar (server)' ~ finishDispatchCycle - 4.8ms since event, 3.0ms since dispatch, handled=true
E/AndroidRuntime(15615): FATAL EXCEPTION: main
E/AndroidRuntime(15615): java.lang.NullPointerException
E/AndroidRuntime(15615):    at com.worklight.androidgap.WLDroidGap.onPrepareOptionsMenu(WLDroidGap.java:163)
E/AndroidRuntime(15615):    at com.worklight.androidgap.WLDroidGap.onCreateOptionsMenu(WLDroidGap.java:159)
E/AndroidRuntime(15615):    at android.app.Activity.onCreatePanelMenu(Activity.java:2458)
E/AndroidRuntime(15615):    at com.android.internal.policy.impl.PhoneWindow.preparePanel(PhoneWindow.java:389)
E/AndroidRuntime(15615):    at com.android.internal.policy.impl.PhoneWindow.onKeyDownPanel(PhoneWindow.java:770)
E/AndroidRuntime(15615):    at com.android.internal.policy.impl.PhoneWindow.onKeyDown(PhoneWindow.java:1435)
E/AndroidRuntime(15615):    at com.android.internal.policy.impl.PhoneWindow$DecorView.dispatchKeyEvent(PhoneWindow.java:1824)
E/AndroidRuntime(15615):    at android.view.ViewRootImpl.deliverKeyEventPostIme(ViewRootImpl.java:3492)
E/AndroidRuntime(15615):    at android.view.ViewRootImpl.handleFinishedEvent(ViewRootImpl.java:3464)
E/AndroidRuntime(15615):    at android.view.ViewRootImpl.handleMessage(ViewRootImpl.java:2601)
E/AndroidRuntime(15615):    at android.os.Handler.dispatchMessage(Handler.java:99)
E/AndroidRuntime(15615):    at android.os.Looper.loop(Looper.java:137)
E/AndroidRuntime(15615):    at android.app.ActivityThread.main(ActivityThread.java:4524)
E/AndroidRuntime(15615):    at java.lang.reflect.Method.invokeNative(Native Method)
E/AndroidRuntime(15615):    at java.lang.reflect.Method.invoke(Method.java:511)
E/AndroidRuntime(15615):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:809)
E/AndroidRuntime(15615):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:576)
E/AndroidRuntime(15615):    at dalvik.system.NativeStart.main(Native Method)

Answer 1

If you are on Worklight 5.0.5.x try this:

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    super.loadUrl(getWebMainFilePath());  // yes, this is an extra invocation
    super.setIntegerProperty("splashscreen", R.drawable.splash);
    super.loadUrl(getWebMainFilePath(), 5000);
}

If you are on Worklight 5.0.6.x try this:

public void onCreate(Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    super.setIntegerProperty("splashscreen", R.drawable.splash);
    super.bindBrowser(appView);
    super.loadUrl(getWebMainFilePath(), 5000);
}

Answer 2

If you are using 6.0+, you do not need write any native code. Just put a resouce named "splash.png" under android native dir(android/native/res/drawable) and remove the default one. Worklight will automatically show that pic as splash screen when launching app.

Answer 3

I don't know if it will help but i did my splash screen like this. Maybe you should try this :

    setContentView(R.layout.splash_screen);

    Handler handler = new Handler();

    // 3 seconds later splashscreen will open
    handler.postDelayed(new Runnable() {

        public void run() {


            finish();

            // to pass main screen

            Intent intent = new Intent(SplashScreen.this, AnaMenuActivity.class);
            SplashScreen.this.startActivity(intent);

        }

    }, 3000); 

Answer 4

You could also code your own JavaScript splash screen. They are not as nice as native splash screens, but in my opinion worth mentioning. They also work x-platform. Here is a dojo example.

1. Create DIV in your HTML:

   <div id="splash"></div>
   

2. Create Styleclass for DIV Element:

   #splash {
       width:100%;   height:100%;    margin:0;   padding:0;
       background-color: red !important;
       position:absolute;
       z-index:999;
   }
   

3. Hide DIV after dojo.ready Event:

   function dojoInit() {
       require([ "dojo", ...modules... ], function(dojo) {
           dojo.ready(function() {
               hideSplash();
           });
       });
   }
   
   function hideSplash(){
       // Dojo Fade Animation
       dojo.fadeOut({
           node:"splash",
           onEnd: function(){
               dojo.style("splash", "display", "none");
           }
       }).play(); 
   }