Does capacitor work with the new Android 12 SplashScreen API?

Capacitor
1

I have an Ionic/Capacitor app that targets Android. As recommended by the Capacitor documentation, my app uses the cordova-res package to generate the splash screen.

The cordova-res splash screen worked until I recently upgraded to the latest AndroidStudio Dolphin 2021.3.1. Now, instead of displaying the splash screen located in the ./resources/splash.png file, it simply displays my app’s icon located in the ./resources/android/icon-foreground.png.

After some research, it seems like this is the default behavior for Android 12 (and later) new SplashScreen API requirement. It is documented here: Splash screens  |  Android Developers. According to this document, the default behavior is for Android to display the app’s icon if you don’t have a splash screen.

I’m wondering if cordova-res and capacitor simply is broken now, because of the new SplashScreen API introduced in Android 12.

Is there any way to force Android Studio to go back to the old way of showing splash screens, which works fine with cordova-res and capacitor?

Is there any plan for capacitor and cordova-res to support the new Android SplashScreen API?

1 Like
2

You can try to use GitHub - ionic-team/capacitor-assets: Local Capacitor icon/splash screen resource generation tool

I had a lot of problems when I upgraded my app to the latest Ionic and Capacitor versions… It took me a while to figure it out how to correctly show the splash screen.

Cordova-res still works, in a way, but you need some configuration in your theme.

<style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
       <item name="android:background">@drawable/splash</item>
       <!-- <item name="android:windowBackground">@drawable/splash</item> -->
       <item name="android:windowSplashScreenBackground" tools:targetApi="s">@color/colorPrimary</item>

       // Set this to the single background color of the splash screen.
       // If you want to change the background color in dark mode, create
       // a night version of the color.
       <item name="windowSplashScreenBackground">@color/colorPrimary</item>

       // Set this to a VectorDrawable. On API 31+ it may animated,
       // in which case it will be animated during launch.
       // See https://developer.android.com/guide/topics/ui/splash-screen
       // for info on size limits.
       <item name="windowSplashScreenAnimatedIcon">@drawable/splash</item>

       <item name="postSplashScreenTheme">@style/AppTheme.NoActionBar</item>
   </style>
1 Like
3

For me it was only working when I also used a new name for the theme and added it to the AndroidManifest.xml file as the starting theme.

styles.xml

<style name="Theme.App.Starting" parent="Theme.SplashScreen">
   <!-- Set the splash screen background, animated icon, and animation duration. -->
   <item name="windowSplashScreenBackground">@color/...</item>

   <!-- Use windowSplashScreenAnimatedIcon to add either a drawable or an
        animated drawable. One of these is required. -->
   <item name="windowSplashScreenAnimatedIcon">@drawable/...</item>
   <!-- Required for animated icons -->
   <item name="windowSplashScreenAnimationDuration">200</item>

   <!-- Set the theme of the Activity that directly follows your splash screen. -->
   <!-- Required -->
   <item name="postSplashScreenTheme">@style/Theme.App</item>
</style>

In the AndroidManifest file I also had to hadd tools:overrideLibrary.
AndroidManifest.xml

<manifest>
   <uses-sdk tools:overrideLibrary="androidx.core.splashscreen" />
   <application android:theme="@style/Theme.App.Starting">
        <activity android:theme="@style/Theme.App.Starting">

I followed this tutorial: Splash screen in Android 12. Starting in Android 12, the… | by Digvijay Girase | Medium