“This is the first day of my participation in the Gwen Challenge in November. Check out the details: The last Gwen Challenge in 2021”
🔥 New Android 12 features
App Splash screens – Android 12 also brings a new splash screen to all apps. Apps can also customize the splash screen in a variety of ways to show off their unique brand personality.
🔥 Launch screen
Android 12 has added the SplashScreen API, which enables new app launch animations for all apps. This includes entering the app movement at startup, a splash screen showing the app icon, and a transition to the app itself.
By default, the startup icon is used.
🔥 How the splash screen works
The following events occur when the user starts the application and the application process is not running (cold start) or the Activity has not been created (warm start). (The splash screen is never displayed during hot boot.)
-
The system displays the splash screen using the theme and any animations you have defined.
-
When the app is ready, the splash screen closes and the app is displayed.
For details on how to launch your app, see startup Optimization for Android Performance Optimization.
🔥 Elements and mechanics of animation
The elements of the animation are defined by the XML resource file in the Android manifest. Each element has a light mode and a dark mode version.
They consist of window backgrounds, animated application ICONS, and icon backgrounds:
Note the following points about these elements:
-
The application icon (1) should be a vector drawable object, which can be static or animated. No more than 1000 milliseconds. By default, the startup icon is used.
-
Icon background (2) is optional and useful when a higher contrast between icon and window background is required. If you use an adaptive icon, when the contrast between the icon and the window background is high enough, the background is displayed.
-
As with adaptive ICONS, one third of the foreground is shielded (3).
-
Window background (4) is composed of opaque monochrome. If the window background has been set and is a solid color, it is used by default if the corresponding properties are not set.
The splash screen animation mechanism consists of entering animation and exiting animation.
-
The entry animation consists of the system view to the splash screen. This is controlled by the system and not customizable.
-
The exit animation consists of an animation run that hides the splash screen and can be customized. If you want to customize it, you’ll have access to splashScreenViews and their ICONS, and you can run any animation on them (with transitions, opacity, and colors). In this case, the splash screen needs to be removed manually when the animation is complete.
🔥 Customize the splash screen of an application
💥 Sets the theme properties to change its appearance
🌀 Set the background color of the splash screen
Set a lavender background.
Effect:
The code is as follows:
<style name="Theme.SccMall.SplashScreen">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowSplashScreenBackground">@color/splash_screen_background</item>
</style>
Copy the codeAndroidmanifest.xml setting theme:
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/Theme.SccMall.SplashScreen">
</application>
Copy the code🌀 Set the ICONS displayed in the middle
A large image of the center icon. Keep 2/3 of the inner margin of the content, otherwise the icon will be cropped out.
Set transparent static ICONS
The ICONS are as follows:
Effect:
The code is as follows:
<style name="Theme.SccMall.SplashScreen">.<item name="android:windowSplashScreenAnimatedIcon">drawable/iv_splash_animation1</item>
</style>
Copy the codeSet transparent dynamic ICONS
Effect:
The code is as follows:
<style name="Theme.SccMall.SplashScreen">.<item name="android:windowSplashScreenAnimatedIcon">@drawable/splash_animate_icon</item>
<item name="android:windowSplashScreenAnimationDuration">1000</item>
</style>
Copy the codesplash_animate_icon.xml
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<item android:drawable="@drawable/iv_1" android:duration="250"/>
<item android:drawable="@drawable/iv_2" android:duration="250"/>
<item android:drawable="@drawable/iv_3" android:duration="250"/>
<item android:drawable="@drawable/iv_4" android:duration="250"/>
</animation-list>
Copy the code🌀 Sets the background color of the icon
Set the icon background color to purple. If the icon background is opaque, the occlusion effect will not be visible.
Effect:
The code is as follows:
<style name="Theme.SccMall.SplashScreen">.<item name="android:windowSplashScreenIconBackgroundColor">@color/splash_screen_icon_background</item>
</style>
Copy the code🌀 Image at the bottom of the screen (size ratio should be 2.5:1, not recommended by Google)
Effect:
The size used here is 500:200.
The code is as follows:
<style name="Theme.SccMall.SplashScreen">.<item name="android:windowSplashScreenBrandingImage">@mipmap/iv_splash_screen_brandingimage</item>
</style>
Copy the code💥 Final Effect
Effect:
The code is as follows:
<style name="Theme.SccMall.SplashScreen">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<! -- Splash screen background color -->
<item name="android:windowSplashScreenBackground">@color/splash_screen_background</item>
<! -- The icon displayed in the middle of the splash screen, the default is the app icon -->
<item name="android:windowSplashScreenAnimatedIcon">@drawable/iv_splash_animation1</item>
<! -- The background of the icon displayed in the middle of the splash screen, invalid if the icon background is not transparent -->
<item name="android:windowSplashScreenIconBackgroundColor">@color/splash_screen_icon_background</item>
<! Launch Screen The picture at the bottom of the launch screen. -->
<item name="android:windowSplashScreenBrandingImage">@mipmap/iv_splash_screen_brandingimage</item>
<! -- How long the splash screen is displayed before closing. The maximum duration is 1000 milliseconds. -->
<item name="android:windowSplashScreenAnimationDuration">1000</item>
</style>
Copy the code💥 makes it appear on screen longer
The longest splash screen is 1000 milliseconds. If your AD page takes more time to load data, Google has a way to make it display longer. Let’s try it out.
Effect:
It takes much longer to catch up than it does to find out.
The code is as follows:
public class AdvertiseActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); .// Extend the splash screen display time
extendDisplayTime();
}
// Extend the splash screen display time
private void extendDisplayTime(a) {
MyViewModel myViewModel = new MyViewModel(getApplication());
// Set up an OnPreDrawListener to the root view.
final View content = findViewById(android.R.id.content);
content.getViewTreeObserver().addOnPreDrawListener(
new ViewTreeObserver.OnPreDrawListener() {
@Override
public boolean onPreDraw(a) {
// Check whether the initial data is ready.
if (myViewModel.isReady()) {
// Cancel the suspension, the content is ready.
content.getViewTreeObserver().removeOnPreDrawListener(this);
return true;
} else {
// Suspend, content not ready.
return false;
}
// If only return false, a permanent SplashScreen is displayed.}}); }public class MyViewModel extends AndroidViewModel {
public MyViewModel(Application application) {
super(application);
}
private long startUptimeMillis = SystemClock.uptimeMillis();
public boolean isReady(a){
return SystemClock.uptimeMillis()-startUptimeMillis>3000; }}}Copy the code💥 Custom animation used to close the splash screen
Effect:
The code is as follows:
public class AdvertiseActivity extends AppCompatActivity {
ActivityAdvertiseBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); .// Close the animation
spplashScreenCloseAnimation();
}
private void spplashScreenCloseAnimation(a){
// Add a callback that is called when the splash screen animates the application content.
getSplashScreen().setOnExitAnimationListener(splashScreenView -> {
final ObjectAnimator slideUp = ObjectAnimator.ofFloat(
splashScreenView,
View.TRANSLATION_Y,
0f,
-splashScreenView.getHeight()
);
slideUp.setInterpolator(new AnticipateInterpolator());
slideUp.setDuration(2000);
// Call splashScreenView.remove() at the end of the custom animation;
slideUp.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
// Remove the splash screensplashScreenView.remove(); }});// Start animationslideUp.start(); }); }}Copy the code🔥 Earlier version adaptation
Effect (Android 5.1)
SplashScreen is a new feature in Android 12. So it doesn’t work on Android 5.1. If you call getSplashScreen() and other Android 12 new methods, they crash.
In fact, many apps have implemented SplashScreen before.
So how does the self-implemented SplashScreen work with the official SplashScreen? Android 12 is mandatory and uses the default app icon if not set. So, if you still have the same set of Splashscreens that you implemented in the past, you’ll see double splashscreens in Android 12.
So you might need to do some special processing depending on the version, or you might want to show SplashScreenView followed by AdvertiseActivity just like in the Demo above. .
So what if you remove your own AdvertiseActivity from the lower version? Anything we can think of, the googlers can think of.
Google provides a backward-compatible SplashScreen library in AndroidX. According to the official word, we can easily adapt to older Versions of SplashScreen using this library.
💥 SplashScreen library
Compatible classes for the SplashScreen API introduced in API 31.
On API 31+ (Android 12+), this class calls platform methods.
Prior to API 31, the platform behavior was replicated, except for animation vector drawable support on the startup screen.
To use this class, set the theme that starts the Activity to r.style. Theme_SplashScreen as its parent, And you need to set up state Richard armitage TTR event. WindowSplashScreenAnimatedIcon and state Richard armitage TTR event. PostSplashScreenTheme properties.
This library is used for backward compatibility. Note the contents:
- The center icon animation of the splash screen (invalid)
- The Activity theme must have r.style. Theme_SplashScreen as its parent
- All new Splash Screen apis are compatible with API 23, except icon backgrounds.
💥 Use the SplashScreen library
🌀 import libraries
The latest version
android {
compileSdkVersion 31
}
dependencies {
implementation 'androidx. Core: the core - splashscreen: 1.0.0 - alpha01'
}
Copy the code🌀 Set the theme
<style name="Theme.SccMall.Other">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>.</style>
<style name="Theme.SccMall.SplashScreen" parent="Theme.SplashScreen">
<! -- Backward compatibility. -->
<item name="windowSplashScreenBackground">@color/splash_screen_background</item>
<item name="windowSplashScreenAnimatedIcon">@drawable/iv_1</item>
<item name="postSplashScreenTheme">@style/Theme.SccMall.Other</item>
</style>
Copy the codeNote that none of them have Android in front of them:.
WindowSplashScreenBackground: splash screen background color.
WindowSplashScreenAnimatedIcon: the center of the splash screen icon.
PostSplashScreenTheme: Specifies the original theme of your App. This way, when SplashScreen ends, your theme can be restored without affecting the look of your App’s theme.
🌀 set AndroidManifest. XML
<application
...
android:theme="@style/Theme.SccMall.SplashScreen">
</application>
Copy the codeI’m here in the original name change, so I don’t have to reset
Set SplashScreen in 🌀 Activity
public class AdvertiseActivity extends AppCompatActivity {
ActivityAdvertiseBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
SplashScreen.installSplashScreen(this);
binding = ActivityAdvertiseBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
binding.tvSplashJumpOver.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(AdvertiseActivity.this."I'm going to skip it.",Toast.LENGTH_SHORT).show(); }}); }}Copy the codeBe sure to precede setContentView().
Of course, Android 12 features still cannot be used (such as extending the splash screen display time).
🌀 Operating effect
Android 22 (5.1.1)
I see the background color, even the center icon doesn’t work.
Android 29(10)
The background color is there, the center icon is there, and the theme has been changed back.
But some features of Android 12 are missing.
🌀 summary
-
Android SDK <23: No center ICONS
-
23 < Android SDK <31: The center icon is not rounded
-
Android SDK >=31: the new version of the method cannot be used
🔥 Android 5.0 – Compatible with Android 12
💥 does not process, Android12 starts short splash screen by default.
💥 modified using the SplashScreen library
🌀 Theme Modification
Create a values-v31 for Android 31 and put custom values in itTheme.SccMall.SplashScreen.
At the same time new
<item name="postSplashScreenTheme">@style/Theme.SccMall.Other</item>
Copy the code🌀 Activity changes
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
SplashScreen.installSplashScreen(this); binding = ActivityAdvertiseBinding.inflate(getLayoutInflater()); setContentView(binding.getRoot()); .// Determine whether to use this method based on the version.
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) { extendDisplayTime(); splashScreenCloseAnimation(); }}Copy the codeRunning effect
Android 12: Custom apps have a splash screen showing how they work.
Other versions: Runtime renderings using the SplashScreen library.
I won’t waste your time sticking to the graph here.