Search code examples
ionic-frameworkionic2ionic3ionic4capacitor

Capacitor splash screen animation

I have an Angular 2+ app wrapped with Capacitor. I want to add a splash screen animation to it.

After researching this issue I understood that animating the splash screen is not possible, but we can wait until the app is launched and add the animation to it.

Can someone explain the process of loading animation into an app? How do applications load an animation upon app startup? Sharing Android/iOS code is appreciated.

Solution

  • Creating Splash Screens and Icons
    Follow the steps in here

    1. First install

      npm install -g cordova-res

    2. Create a resources folder in the project with icon.png ( must be at least 1024×1024px) and splash.png (must be at least 2732×2732px). The resources folder should be at the same level as src folder.

    3. Run the following commands for iOS/Android:

       cordova-res ios --skip-config --copy
 cordova-res android --skip-config --copy

    Good luck! :)