Search code examples
iosjquery-mobilecordovasplash-screen

Splash screen doesn't show in ripple emulator


I am trying to make iOS app using PhoneGap and jQuery Mobile and I use Ripple emulator to test it. I have already set .png images in my config.xml file. I also added

<gap:plugin name="org.apache.cordova.splashscreen" version="0.3.1" /> 
<feature name="SplashScreen">
    <param name="ios-package" value="CDVSplashScreen" />
</feature>

to my config.xml file. I installed plugin for splashscreen before that.

I have these 2 lines in my config.xml file

<preference name="auto-hide-splash-screen"    value="false" />           <!-- ios: if set to false, the splash screen must be hidden using a JavaScript API -->
<preference name="SplashScreenDelay"          value="2000"/>

In my index.html I have this

    <!-- MAIN PAGE CONTAINER START -->
    <div data-role="page" >
        <div></div>
    </div> 
    <!-- MAIN PAGE CONTAINER START -->

    <!-- SCRIPT START --->
    <script type="text/javascript" src="phonegap.js"></script>
    <script src="spec/lib/jquery-1.11.1/jquery-1.11.1.min.js"></script>
    <script src="spec/lib/jquery.mobile-1.4.2/jquery.mobile-1.4.2.min.js"></script>
    <script src="js/initPages.js"></script>
    <!-- SCRIPT END --->

    <script>
        document.addEventListener("deviceready", onDeviceReady, false);

        function onDeviceReady() {
            navigator.splashscreen.hide();
        }

        $( document ).bind( "mobileinit", function() {
            $.mobile.allowCrossDomainPages = true;
        });         

    </script>
</body>

When I run it in Ripple, it doesn't show the splashsceen image. I am not sure what I am doing wrong.


Solution

  • Of course your splash screen cannot run inside your ripple emulator. It's not a glitch or bug. You need to run your cordova app inside your real device, I mean a mobile phone. Cordova functionality can't use if you run it inside emulator. Run it on mobile phone.