Splash screen is one of the most vital screens in the application. It's the user's first experience with the application. Android 12 introduced splash screens as default behaviour along with the SplashScreen API. With these changes, it’s a good time to take a deep dive into splash screen implementation on Android.
In this talk, we'll take a deep dive into the new SplashScreen API and explore it using practical examples. We’ll start from the basics, like what is a splash screen and why it is important. After that we’ll learn how to customise the default splash screen in Android 12 and how to migrate legacy splash screen implementations. At the end, we’ll have a working splash screen implementation with a consistent experience across Android versions.
At the end of this talk, you should have a better understanding of splash screens in general, SplashScreen API and its capabilities and limitations, and how you can use that knowledge to make app startup a more consistent and delightful experience.
Splash screens can seem trivial at first, but are often misused and with multiple possible approaches of adding a splash screen in the past, they were often done wrong. Luckily, with the SplashScreen API introduced, there’s now a single solution to ensure consistency across codebases. If you’re an Android developer, odds are you’ll work with splash screens sooner or later, so join me in this journey and learn how to do it the right way!
3. First Impressions Matter
With any introduction – to people, places, or products – first impressions are critical
It only takes 50ms for users to form a first impression
It’s vital that your first impression is always your best one
5. “The launch screen is a user’s first experience of your app.”
Material Design
6.
7. What is a Splash Screen?
The very first screen the user sees when they open up an app on a mobile device
It appears while the app is loading when the user has just opened up the app
Splash screen is often called a launch screen
Mostly has a logo, brand name, or slogan related to the product and it is minimalistic in
nature
10. System Process
time
Load & Launch
Application
Application Process
Display start
window
<other stuff>
MainThread
Application
onCreate
Activity init
Activity
onCreate
Initial composition, etc.
Swap start
window for
app
11. App startup states
App launch can take place in one of three states
Each state affects how long it takes for your app to become visible to the user
Startup states:
• Cold start
• Warm start
• Hot start
12. Cold Start
App is starting from scratch
Happens when your app’s being
launched for the first time
Perfect for showing a splash
screen that gives the impression of
a shorter delay
3
Warm Start
The system does not need to
initialize everything but has lost
some information and needs to
reload it
Doesn’t take as long as a cold
start, but it’s often long enough to
warrant a splash screen
2
Hot Start
All the system does is bring your
activity to the foreground
It’s quick, leaving no time for a
splash screen
1
14. Splash Screens Over the Years
Once viewed as an anti-pattern
Often misused as a way to embed branding into apps
Intentionally delaying users from reaching the content for a few seconds
As Android evolved and app requirements grew, the time taken to launch apps began to
increase
The Material Design guidelines started recommending a splash screen
Lack of documentation → multiple approaches of adding a splash screen
No APIs or libraries existed to ensure consistency across codebases
15. Android 12 (API level 31)
Brought a new SplashScreen API
All apps show a default splash screen
Backwards compatible (to a certain extent)
16. Idea behind a new SplashScreen API
Opinionated implementation
Standard and consistent implementation across all devices and operating systems
No boilerplate code
Provide branding and animation support
19. Platform API vs Compat Library
Provides control over the splash screen once
the application is started
On API 31+ (Android 12+) this class calls the
platform methods
Prior API 31, the platform behavior is
replicated
SplashScreen compat library - wraps the
SplashScreen API
SplashScreen
Impl
Impl31
21. Customizable
elements of a
splash screen
Customizing
the animation
for
dismissing the
splash screen
Keeping it
on-screen for
a longer period
Appearance
24. Icon
Icon can be any vector drawable or PNG
By default, SplashScreen uses the launcher icon
Icon
25. Icon Rules
Needs to follow the same rules as the Adaptive
Icon - needs to fit within a circle whose
diameter is 2/3 the size of the icon
26. Icon Mask
Icon is masked using system mask
Don’t use adaptive icon - adaptive icon is
already masked (cropped two times)
Use just the foreground part and set the
background separately
27. Icon Size
With an icon background: 240×240 dp
Without an icon background: 288×288 dp
The actual values don't really matter if you use a
vector icon
192dp
288dp 240dp
160dp
29. Define splash screen style
This style will define your splash screen
Define splash icon
Set the icon for the Splash screen
Define post splash
screen theme
Defines which theme to apply to the
Activity once the splash screen is
dismissed
Installing the splash
screen
Set the splash style
Set the `theme` attribute to splash
screen style that you’ve defined
05
01
02 03
04
30. Define splash screen style
Setting style attributes changes splash screen
appearance
Attributes that start with “android:<name>” are
only for API31+
32. Define post splash screen theme
postSplashScreenTheme attribute defines which
theme to apply to the Activity once the splash
screen is dismissed
33. Setting the splash style
In manifest file, set the `theme` attribute of
the whole <application> or just the starting
<activity> to splash screen style that you’ve
defined
34. Installing the splash screen
In the `onCreate` method of the starting activity, call installSplashScreen to install the splash
screen
installSplashScreen method creates a SplashScreen instance associated with that Activity and
handles setting the theme to [R.attr.postSplashScreenTheme]
Needs to be called before Activity.setContentView or other view operations on the root view (e.g
setting flags)
35. Installing the splash screen
SplashScreen reference is assigned to a val to use
later for extra customization
41. App Launch - Known Issue*
SplashScreen API on Android 12 shows blank screen when launched via third-party-launchers,
app-info, and from IDE
By default splash screen isn’t shown - launcher sets a special flag that shows the splash screen
Splash screen not displayed if you open an app from deeplink
Android Studio runs app using adb which is considered as a launch from another app, not a
launcher
43. Splash background
Background color of the splash screen
windowSplashScreenBackground attribute
Defaults to the theme's windowBackground
Single opaque color
Background
46. Icon background
Optional color displayed below the icon
Useful if you need more contrast between the
icon and the window background
Icon Background
47. Change theme
To enable the icon background, splash theme
needs a different parent
Ensures that the scale and masking of the icon
are similar to the Android 12 Splash Screen
48. Adding an Icon background
windowSplashScreenIconBackgroundColor
attribute sets a background behind the splash
screen icon
51. Branding image
Optionally, you can set an image to be shown at
the bottom of the splash screen
The design guidelines recommend against
using a branding image
Only supported on API 31+
Should have the size of 200×80 dp
Use vector asset to prevent loss of quality when
the image is scaled
Branding logo
52. Creating a New Style for Android
12
Create a new resource directory with the API
31 qualifier
Add a copy of the theme you declared for your
splash screen
android:windowSplashScreenBrandingImage
attribute places a drawable image in the bottom of
the starting window
57. 1.
Enter animation
Consists of the system
view to the splash screen
This is controlled by the
system and is not
customizable
Splash screen
Allows you to supply your
own logo animation
2.
Exit animation
Animation run that hides
the splash screen
Can be customized
3.
Splash Screen animation launch sequence
59. Animated Icon
Has aesthetic appeal
Provides a more premium experience
User research shows that perceived startup time is less when viewing an animation
Only supported on API 31+
61. Adding animated icon
windowSplashScreenAnimationDuration
attribute sets the duration, in milliseconds, of the
window splash screen icon. Recommend not to
exceed 1,000 ms on phones
It does not actually affect the duration of an
animation of the icon as this is set by an
AnimatedVectorDrawable
64. Exit Animation
You can customize the exit animation of the splash screen that is run once the app has loaded
To customize it, you'll have access to the SplashScreenView and its icon and can run any
animation on them
The splash screen needs to be manually removed when the animation is done
Backwards compatible
65. OnExitAnimationListener
onSplashScreenExit
SplashScreenViewProvider
The listener will be called once
the splash screen is ready to be
removed
Callback called when the splash
screen is ready to be dismissed
The caller must remove the
splash screen once it's done
with it
An object holding a reference
to the displayed splash screen
Contains time information
about the animated icon
Provides references to the
splash screen view and icon
view
66. Adding Exit Animation
Get references to the splash screen view and
icon view
splashScreenView is used to create custom
animation from the splash screen to the
application
iconView contains the splash screen icon as
defined by windowSplashScreenAnimatedIcon
attribute
67. Define and Play Exit Animation
Define and play animation for splash screen
view and icon
Once the animation is finished, remove the
splash screen from view hierarchy
SplashScreenViewProvider.remove() always
needs to be called when an
OnExitAnimationListener is set
71. Take the first frame of the
animation and convert it to
an SVG
Import and convert the
SVG into a vector drawable
using the Resource Manager
tool
Add lottie animation to the
initial Activity and ensure
that LottieAnimationView is
aligned with splash icon
Synchronize the end of the
splash screen animation
with the start of the lottie
animation and manually
dismiss the system splash
screen to seamlessly transition
from it to the initial activity
72. Shared element transition animation
Not possible to use directly with the splash screen
Workaround is similar to lottie animation
Add element to the initial Activity and ensure that the element is aligned with element on splash
icon
Synchronize the end of the splash screen with the start of the element animation and
manually dismiss the system splash screen to seamlessly transition from it to the initial activity
73. The disclaimer
Don't do that. It's bad
Letting users wait on a fancy but useless animation is against good UX
Application start should be as fast as possible and the splash screen should be dismissed as soon as
you have some content to display
75. Launcher theme
During the cold start, the window manager tries to
draw a placeholder UI using attributes from the
app theme
Default windowBackground can be changed
Splash screen only shows when needed - no
intentional delays
Inflexible - no animations
Splash Activity
Dedicated splash screen Activity that shows up for
fixed amount of seconds
More flexibility
Introducing additional delay
Your app has two splash screens on Android 12
and above
77. Splash Activity
If targetSdk is 31 or above, Android Studio
issues a warning if you have custom splash
screen implementation
Migrate your app to the SplashScreen API
79. Summary
Splash screen is a critical aspect of the user experience
How to use the SplashScreen API to provide a smooth experience for users
Test your existing projects to ensure they’re compatible with Android 12
80. Show me the code
https://github.com/dean95/splash-screen-sample
