DEV Community

Cover image for Implementing Splash Screens the Recommended Way
Joseph Olugbohunmi
Joseph Olugbohunmi

Posted on • Edited on

Implementing Splash Screens the Recommended Way

Do this in four steps only

With the release of Android 12 (API 31), a new SplashScreen API was introduced to ensure there is a standard in how Android Apps are launched. This means that using the traditional Splash screen approach will result in unexpected behaviours if your App is installed on Android 12 devices (or higher). But not to worry, implementing a Splash screen using this new API can be done in 4 simple steps. Worthy of note, is the fact that this API is backwards compatible which means it can as well be implemented on Android 11 and lower. You can easily migrate your existing Splash screen implementation to conform to the new recommended way (we will dive into that much later).

NB: This article is also available on Medium

Now the four simple steps…

Step 1: Add the dependency
In the App's build.gradle file, add the dependency to download the library's artefacts

dependencies {
    ...
    implementation "androidx.core:core-splashscreen:${current_version}"
}
Enter fullscreen mode Exit fullscreen mode

At the time of writing this article, the version was 1.0.0

Step 2: Create the theme
In the styles.xml file, create a new theme (any name is fine) and set its parent to Theme.SplashScreen or Theme.SplashScreen.IconBackground

<style name="SplashScreenTheme" parent="Theme.SplashScreen">
    <item name="windowSplashScreenBackground">@color/colorWhite</item>
    <item name="windowSplashScreenAnimatedIcon">@drawable/ic_launcher</item>
    <item name="postSplashScreenTheme">@style/AppTheme</item>
</style>
Enter fullscreen mode Exit fullscreen mode
  • windowSplashScreenBackground specifies the window background
  • windowSplashScreenAnimatedIcon specifies the image you want to see on the screen. In Android 11 and below, the image specified here is not animated but in Android 12 and above it comes with a nice animation and so you could use an optional attribute windowSplashScreenAnimationDuration with a recommended value of 1000 to specify the duration of the animation.
  • postSplashScreenTheme specifies the theme the App is expected to use after the expiration of the Splash action (usually the AppTheme)

Step 3: Add the theme to the Manifest
In the AndroidManifest.xml file, set the theme to the Application as a whole or just the MainActivity (or your starting activity).

<application
    android:name=".MyApplication"
    android:theme="@style/SplashScreenTheme"> 

                OR

<activity 
    android:name=".MainActivity"
    android:theme="@style/SplashScreenTheme">
Enter fullscreen mode Exit fullscreen mode

Step 4: Install the Splash screen
In the MainActivity.kt file, call the extension function to install the Splash Screen, just before the call to super.onCreate(savedInstanceState)

override fun onCreate(savedInstanceState: Bundle?) {
    installSplashScreen()
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
}
Enter fullscreen mode Exit fullscreen mode

And that's it, launch the App and you should have a cool splash screen after which you should have a smooth transition into your App. The good part as I said earlier is that you can follow these same steps for any Android API level at all


What if your App already has a Splash Screen?
Well, there is a solution…

Splash Screen Lint Warning
I am sure you must have seen this already in your existing Splash Screen Implementation. You may decide to suppress it @SuppressLint("CustomSplashScreen") and move on, but if your App is installed on Android 12 devices, the behaviour would be awful. But not to worry, it is very easy to migrate to the new API, it is as easy as the four steps we discussed earlier. Just follow those steps and there you go!
In addition to that, if you have a delay mechanism in your Splash Screen - maybe you are pulling some data from remote or local storage, you have to call the setKeepOnScreenCondition function on the SplashScreen object.

override fun onCreate(savedInstanceState: Bundle?) {
    val splashScreen = installSplashScreen()
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_splash)
    splashScreen.setKeepOnScreenCondition { true }
    startJob()
}
Enter fullscreen mode Exit fullscreen mode

This helps keep the Splash Screen open until the App is ready to launch the next screen and it also ensures you have a smooth transition into your App.

For advanced topics relating to the SplashScreen API, you can have a look at the official documentation.

Thanks for reading! If you have any observations, kindly share your thoughts in the comment section. You can also reach out to me via Twitter or LinkedIn.

Top comments (0)