Mastering Android Splash Screens
Take the user experience to the next level as your Android app initializes.
A splash screen API, introduced in Android 12, is a graphical and attractive screen that appears when an application is launched. Its main objective is to give a visual representation to the user while the application initializes and gets its resources ready for usage. It is a window and therefore covers an activity.
The default splash screen contains the application’s icon. By using the splash screen API, we can make the desired changes and add animations as needed.
The splash screen will initiate when the user runs an app that is not active on the device. It is shown by the system using themes and animations and disappears when the app resources are ready.
Here are some key uses of splash screens
- Loading indication: The splash screen is the first screen that appears when an app starts, preventing the app from appearing stuck while the resources are getting ready. It effectively eliminates the perception of the app being unresponsive or stuck, and the users feel that the application is actively launching.
- User experience: The overall user experience can greatly improve with splash screens. Users aren’t forced to stare at a blank screen. Instead, they are taken away from the loading process by a splash screen.
- App initialization: It also helps with necessary initial operations, such as loading resources, establishing connections, etc. Consequently, when the splash screen disappears, the application will be ready for use.
- Brand consistency: A thoughtfully designed splash screen contributes to brand consistency and reinforces the app’s overall theme and visual identity. By aligning the splash screen with the app’s branding elements, like colors, logos, and typography, developers can create a cohesive and visually appealing user experience.
- Compliance information: Splash screens can also display copyright and branding information.
Steps for customizing splash screen
Step 1: Add the dependency of the splash screen API in your build.gradle file:
dependencies {
...
implementation "androidx.core:core-splashscreen:version_code"
}Step 2: Design an app logo or animation for the splash screen. Additionally, if there is a branding logo, design it as well.
Step 3: Create a style according to your requirements. Using the following attributes, you can design your splash screen. Use “Theme.SplashScreen” as the parent of style:
<style name="SplashScreenTheme" parent="Theme.SplashScreen">
...
</style>The app icon can be static drawable, or animated. It is placed in the middle of the splash screen and serves as the first interface for the user. It can be modified using:
<item name="android:windowSplashScreenAnimatedIcon">@drawable/ic_app_icon</item>The icon background is optional. It will give more contrast between the icon and the window background. It can be modified using:
<item name="android:windowSplashScreenIconBackgroundColor">@color/teal</item>The splash screen background is a simple color. The default is the window background if an attribute is not set. It can be modified using:
<item name="android:windowSplashScreenBackground">@color/light_yellow</item>The duration of the splash screen is unlimited. It’s better if the animation duration stays under 1000 milliseconds. It can be modified using:
<item name="windowSplashScreenAnimationDuration">1000</item>Additionally, you can include the branding logo at the bottom-middle of your splash screen:
<item name="android:windowSplashScreenBrandingImage">@drawable/ic_branding_logo</item>Here is the output for the above attributes:
Step 4: Create a splash screen as a launcher activity and add your splash screen theme to your splash screen activity in the manifest file.
<application
...
<activity
android:name=".SplashScreenActivity"
android:theme="@style/SplashScreenTheme"
android:exported="true">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>Step 5: To ensure proper functionality, remove the splash activity from the back stack since it is initialized only once. Instead, introduce a launch screen in its place.
class SplashScreenActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
startActivity(Intent(this, MainActivity::class.java))
finish()
}
}If you want to add a splash screen to an activity during a process and make it disappear after the process is complete, use the following:
import androidx.core.splashscreen.SplashScreen
class SplashScreenActivity : AppCompatActivity() {
private lateinit var splashScreen: SplashScreen
override fun onCreate(savedInstanceState: Bundle?) {
splashScreen = installSplashScreen()
super.onCreate(savedInstanceState)
// Splash screen does not disappear until the new activity is launched.
splashScreen.setKeepOnScreenCondition{true}
// Write launch and finish activity code after your process gets over.
startActivity(Intent(this, MainActivity::class.java))
finish()
}
}Best practices to implement a splash screen
Splash screen API is very easy to use. It improves branding and provides customers with pleasant distractions while they wait. Here are some guidelines to follow when creating your splash screen:
- Keep it free of pointless interruptions
- Use only one color and one logo
- Use animation
Mistakes to avoid when using a splash screen
The standard method for creating a splash screen is to use a handler (timer). However, a problem may arise if the user minimizes the application before the handler duration is complete. In such cases, after the handler duration, the code block for launching an activity may execute, resulting in a poor user experience. This happens because the user has minimized the application, and it opens up again unexpectedly.
class SplashActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_splash)
Handler(Looper.getMainLooper()).postDelayed({
startActivity(Intent(this@SplashActivity, MainActivity::class.java))
finish()
}, 1000)
}
}We can manage it programmatically. Please refer to the code below:
import android.os.Handler
import android.os.Looper
class SplashActivity : AppCompatActivity() {
private lateinit var handler: Handler
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_splash)
}
override fun onResume() {
super.onResume()
// Initializing Handler.
handler = Handler(Looper.getMainLooper())
// Adding postDelayed and Runnable.
handler.postDelayed({
startActivity(Intent(this@SplashActivity, MainActivity::class.java))
finish()
}, 1000)
}
override fun onPause() {
super.onPause()
// Setting the assigned Runnable to null to prevent its execution.
handler.removeCallbacksAndMessages(null)
}
}Conclusion
A splash screen is an attractive screen that appears while an application loads, giving a visual representation and improving the overall user experience.
It is important to follow recommended practices while implementing splash screen API. Relying solely on a timer-based strategy to initiate an activity is considered bad practice, as it may lead to a poor user experience when the application is minimized.
By correctly implementing splash screens, developers can facilitate a great first impression of the app.
For more updates on the latest tools and technologies, follow the Simform Engineering blog.
