Starting the Android 12, splash screens are handled differently by Android. This came up recently on a Cordova forum. Here are some excerpts from the discussion:
Doug Davies 1:24 PM
I’ve been over in Capacitor world for a while but upgrading my Cordova app from cordova-android 10 to 12. This of course has new requirements for the splash page. My splash page WAS a full screen affair. Now it appears it just wants to show a smaller icon inside of a circular mask. Is there anyway to fake that out (show a pure white icon on a pure white background), but then have the OLD splash screen plugin kick in and show my splash page? I’m ok with the brief white page, as long as I can give the appearance that the old splash page is working. It’s weird, because on Capacitor they still allow me to show the full-screen splash page on Android < 12. It’s only on Android >= 12 that the icon requirement kicks in. Seems like on cordova-android it now shows the icon for all Android versions. This is super confusing all around and sucks that Google is dictating our design decisions, even though iOS still allows me to do the full-screen splash. (edited)
Erisu 5 days ago
You might be able to create small white image and set background to white so all you see is a white screen as you asked.But depending on how the app is programmed, eg fetching data before hiding splash, might show the white screen for while and will confuse app users if it crashed. So you have to remove this logic but apply it differently.Then I’m app code you program you own splash and load it up first before anything else and hide it when ready. But that is app level logic and not a plugin.
Norman Breau 1:29 PM
Is there anyway to fake that out (show a pure white icon on a pure white background), but then have the OLD splash screen plugin kick in and show my splash page?
The android way is to implement the icon for the splashscreen, then you can transition into an app view, which could be splashscreen-like if you want.
Doug Davies 1:31 PM
My icon is NOT conducive to being on the splash page… hard to explain, but it’s just not gonna look good. I left the config in for the OLD splash screen plugin, but it doesn’t seem to get displayed after the icon splash page (like Capacitor seems to do).
Norman Breau 1:31 PM
Android’s splashscreen system is natively in Android 12… so on Android 12 you will get a splashscreen no matter what. If your app doesn’t declare the splashscreen theme, it will fallback to use the app launcher icon, which is close but not exactly the proper dimensions for the splashscreen icon. Therefore it may not look right.Cordova imports the splashscreen compatiblity library which brings the Android 12 splashscreen system to older android versions.
1:33
The reason why Cordova has done that is because if they had the old splashscreen system (via the splashscreen plugin) you’ll end up seeing both.
Doug Davies 1:33 PM
right, so is there a way to force it, so I get the icon splash then the old splash?
Norman Breau 1:34 PM
well cordova doesn’t really support it. The splashscreen plugin is deprecated and won’t install. If you hack it and force it to install by changing the engines, then the JS api will break, and I’m not sure what other conflicts will occur.
1:35
So basically if you want both systems, you’ll probably have to fork the splashscreen plugin, rename the mappings so you don’t clash with the two splashscreen apis… and remove the engine limitation so that the plugin will install
Doug Davies 1:36 PM
oh, ok. Well i’ll see if I can work with our designer and get rid of our old full-screen splash page and replace with just the icon. Guess I’ll have to bastardize the iOS version for consistency (shame). Our splash-page was fairly informational with text and stuff, so it’s a shame we lose all that. (edited)
Norman Breau 1:36 PM
rename the mappings so you don’t clash with the two splashscreen apis.
By this, I mean the JS module clobbers
1:37
so that navigator.splashscreen will be the cordova-android platform splashscreen API, and you will need to chang ethe plugin clobbers to something else. Right now both are the same which is why it will conflict
1
Doug Davies 1:37 PM
ok. thanks for the info. helpful
Norman Breau 1:38 PM
also not sure if there wil be duplicate symbols in the native code, so you might need to rename some class names too
1:38
Yah I didn’t really like how Android forces a particular splashscreen style, I’m with you there, but it is what it is unfortunatley (edited)
1
Norman Breau 1:47 PM
oh, ok. Well i’ll see if I can work with our designer and get rid of our old full-screen splash page and replace with just the icon.
Ideally this would be the best path forward.It’s also important to note that the splashscreen is suppose to have a short duration (generally < 1 second). If the dismissal of the splashscreen takes too long, it will trigger ANR (App Not Responsive) reports against your app… which may result with a prompt asking the user if they want to wait or kill the app since it appears to be “not working”, and will trigger negative metrics against your app which can negatively influence app store ratings.This wasn’t thing before because the old splashscreen was a part of the app, so as far as the OS is concerned the app was working and responsive. The new splashscreen API also makes it easy for the OS to determine if the app is actually being slow to launch their screen.Something to keep in mind.Basically if you used your splashscreen as a loading screen as an example, then you should migrate from the new splashscreen to an actual loading screen to avoid ANR flags.
1