The splash screen is the first thing we notice when using any Android program. I struggled to find the right approach to Android development when I first started learning about it, but when the process was officially disclosed by the Android developer's team, the "issue" was resolved. This tutorial summarizes my learnings.

Note: Because Android development has used a "Kotlin-first" strategy since 2019, I'll solely demonstrate Kotlin in this tutorial. However, Java is also an option.

Starting Your Android Project

To create the project, you'll just need to follow the steps below:

  • Create New Project > Empty Compose Activity
  •  
  •  
  • Then configure the project inserting its name, package, etc.
  •  

With these basics in place, you're ready to implement the splash screen into your project.

Settings

Now we need to set up some configurations in our project.

Build.gradle

Your compileSdk needs to be at least 31, and you need to add the splash screen dependency.

android {
   compileSdkVersion 32
   //Other configuration
}
dependencies {
   //Other dependencies
   implementation 'androidx.core:core-splashscreen:1.0.0-rc01'
}
 
Theme

It's also necessary to create a new theme, and you can do so by following the steps in the example below.

Please note that the theme from the Android operating system, Theme.SplashScreen, must be the parent of your theme. Additionally, you must set the theme of your following activity on the postSplashScreenTheme attribute.

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

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

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

Note 1: If you want to add a background color for your icon, you can use the theme: Theme.SplashScreen.IconBackground along with the attribute: windowSplashScreenIconBackground.

Note 2: The attribute windowSplashScreenAnimationDuration is only used with animations. For images, it's not necessary.

 
Manifest

This new theme must now be included in your application or activity. It's a personal preference, but I like to add it to the activity.

<application
        android:allowBackup="true"
        android:dataExtractionRules="@xml/data_extraction_rules"
        android:fullBackupContent="@xml/backup_rules"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.SplashScreen"
        tools:targetApi="31">
        <activity
            android:name=".MainActivity"
            android:exported="true"
            android:label="@string/app_name"
            android:theme="@style/Theme.App.SplashScreen">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
</application>
 
Activity

After super.onCreate() in your Activity, you must use the function installSplashScreen(). The method installSplashScreen() returns the splash screen object, so you can customize the behavior with these two methods: setKeepOnScreenCondition and setOnExitAnimationListener. Depending on the requirements of your project, you can employ one or more of these techniques. Let's look at both in turn.

setKeepOnScreenCondition

As its name implies, this method will continue to display the splash screen until something happens. In my situation, a viewModel is in charge of determining when the object will vanish.

class MainActivity : ComponentActivity() {

    private val mainViewModel: MainViewModel by viewModels()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        installSplashScreen().apply {
            setKeepOnScreenCondition {
                mainViewModel.isLoading.value
            }
        }

        setContent {
            SplashScreenTheme {
                Box(
                    modifier = Modifier.fillMaxSize(),
                    contentAlignment = Alignment.Center
                ) {
                    Text(text = "Hello World!")
                }
            }
        }
    }
}

 

setOnExitAnimationListener

In this case, you can do anything after your splash screen has finished. For instance, load data, check the cache, etc.

class MainActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        installSplashScreen().apply {
            setOnExitAnimationListener{
                //Do something after the Splash Screen
                it.remove()
            }
        }

        setContent {
            SplashScreenTheme {
                Box(
                    modifier = Modifier.fillMaxSize(),
                    contentAlignment = Alignment.Center
                ) {
                    Text(text = "Hello World!")
                }
            }
        }
    }
}
 
Conclusion

And that's all you need to know to make a splash screen in accordance with the procedure described on the official Android Developers site! Tell me how it goes in the comments below.


Author

Diego Cesar

Diego Cesar is an Android Engineer at Avenue Code. He has more than ten years of experience and enjoys learning about development, music, movies, and books.


Create a Tunnel from Anypoint Platform to GCP Using an HA VPN

READ MORE

Create a Classic Tunnel from GCP to Anypoint Platform

READ MORE

AC Spotlight - Angela Hsu

READ MORE