Search code examples
cordovaionic-frameworksplash-screen

Ionic: How to activate default splash screen?

I am making an app, that to initialize everything it takes about a second. So it became clear that the best solution is to display a splash screen.

I am now making a blank app from scratch to test it.

THE STEPS:

For now i have done the following steps:

  1. Create a blank app.

  2. Added platform android and ios.

  3. Running ionic resources (i suspect there is no need of this if have added platforms, but i am not sure)

  4. Check that into the resource folder properly appear icon.png and splash.png

  5. Check config.xml and see that there are the following settings:

    <preference name="SplashScreen" value="screen"/>  
<preference name="SplashScreenDelay" value="3000"/>

  6. Install ngCordova and include it in index.html and as a dependency

    <script src="lib/ngCordova/dist/ng-cordova.js"></script>

angular.module('starter', ['ionic', 'starter.controllers', 'ngCordova'])

It is supposed to work i guess. But i don't see any splash screen in my app.

THE QUESTION:

How can i activate the splash screen? I mean how can i actually see it appearing in the main page?

(for test purpose that ionic default image is fine and 3 seconds is okay)

Solution

  • Ok basically it is allright. The problem was just in testing the app (my bad). I was making quick tests in the browser (localhost) and by using quirktools.com/screenfly

    But in order to see the splashscreen in action i had to test the app directly in the phone or with emulators like Genymotion.

    There the splashscreen is working properly. No plugin needed. Basically just following that steps is enough (even without running ionic resources).