Shulou(Shulou.com)06/01 Report--

This article mainly explains "what is the SplashScreen of Android". Interested friends may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn "what is the SplashScreen of Android"?

What is SplashScreen?

SplashScreen actually refers to the splash screen interface. This must be no stranger to our domestic developers, because the vast majority of domestic App will have a splash screen interface, and many App will also use the splash screen interface to advertise. The following picture shows the splash screen interface of QQ:

However, the splash screen interface is not very common overseas, and even Google previously did not recommend us to add a splash screen interface to App, so I was a bit surprised by the official launch of SplashScreen in Android 12.

However, this time the official SplashScreen is different from the common splash screen interface in our country, it is not for you to advertise in this interface, but to avoid keeping users waiting in a blank interface for too long when App initializes.

Although Android has always advised us to postpone the execution of heavyweight operations, so that the startup time of App is as short as possible, it still can not completely avoid some of the brief white screen situations when App starts.

Therefore, this SplashScreen is launched to solve this problem, it will improve the user experience to some extent, completely bid farewell to the past startup white screen phenomenon.

When will SplashScreen be displayed

Note that SplashScreen is mandatory on Android 12, and even if you do nothing, your App will automatically have a SplashScreen interface on Android 12. By default, App's Launcher icon is used as the central icon of the SplashScreen interface, and the color specified by the windowBackground property is used as the background color of the SplashScreen interface. But all of these can be modified.

We'll talk about how to modify it later, since the SplashScreen interface is mandatory, we should first figure out, under what circumstances will SplashScreen be displayed?

According to the official documentation, SplashScreen will be displayed when the App is cold and warm, and will never be displayed when the App is hot.

So, what are cold start, warm start and hot start?

In a nutshell, if App is completely killed, it is cold to start it at this time. If the main Activity of App is destroyed or recycled, it is warm to start it at this time. If App is just suspended in the background, it is hot to start it at this time.

My generalization is not accurate enough in some details, but if it's just to get a general idea of the timing of the SplashScreen display, it's okay to understand it this way.

If you want to learn more about the differences between these startup modes, you can refer to the following official documentation link:

Https://developer.android.google.cn/topic/performance/vitals/launch-time

When will SplashScreen be hidden

SplashScreen is introduced to prevent App from taking too long to initialize when it is cold or warm, causing users to see the white screen. So obviously, as long as the App is initialized and the content can be displayed to the user, SplashScreen will automatically hide it.

If you use a more scientific definition, that is, when App starts to draw the first frame on the interface, SplashScreen will disappear.

So when does an App draw the first frame on the interface? We don't have to know its exact timing, but we need to know its approximate timing range, because it determines how we can write code better.

Suppose we write the following code in the main Activity of an application:

Class MainActivity: AppCompatActivity () {override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) setContentView (R.layout.activity_main) Thread.sleep (3000)}

Or you can write something like this:

Class MainActivity: AppCompatActivity () {override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) setContentView (R.layout.activity_main)} override fun onResume () {super.onResume () Thread.sleep (3000)}}

As you can see, we let the main thread sleep for three seconds in the onCreate () and onResume () methods, respectively. Then run the program:

You will find that SplashScreen really shows for more than 3 seconds before it disappears.

It also shows that both the onCreate () and onResume () methods are still in the initialization stage of App and have not begun to draw the first frame on the interface.

Next we can try to modify the code like this:

Class MainActivity: AppCompatActivity () {override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) setContentView (R.layout.activity_main) val contentView: View = findViewById (android.R.id.content) contentView.post {Thread.sleep (3000)}

Here, you can call its post function with the help of any instance of View, and let the main thread sleep for 3 seconds during the callback of post. Then run the program again:

You will find that SplashScreen is only briefly displayed and then enters the main interface of App. But now the main interface can not respond to any events, but will have to wait 3 seconds to respond.

From this we can roughly draw some conclusions: for example, the onCreate () and onResume () methods are executed before App starts to draw the first frame, while the post callback of View is performed after App draws the first frame.

When the first frame is drawn, it shows that something can be displayed on the interface of App, and it will no longer be a blank interface, so there is no point in continuing to show SplashScreen at this time, so SplashScreen should disappear at this time. But at the same time, if we execute the time-consuming logic in the main thread after the first frame is drawn, then the user will actually feel the stutter experience, and SplashScreen can no longer cover it up for us.

In fact, we should not perform long and time-consuming operations on the main thread, either before or after the first frame is drawn. The right thing to do is to do the least in the main thread, so that App can quickly respond to the user's various input events and put all time-consuming logic into child threads.

Extend the display of SplashScreen

Extending the display time of the SplashScreen is a practice that I don't recommend, but we can do it.

Let's start with why it is not recommended to extend the display time of SplashScreen.

In principle, we should make the startup time of App as short as possible, and even with SplashScreen, we should not deliberately make the startup time of App longer.

You know, during the display of SplashScreen, App always performs initialization operations in the main thread. This means that your App main thread is occupied all the time, unable to respond to the user's various inputs, which leads to the possibility of application ANR. With or without SplashScreen, too many time-consuming operations in the main thread can lead to ANR.

So why extend the display of SplashScreen?

There is a saying that the content of their App is read from the server or from the local disk, and even if the App is initialized and the data is not ready, there is no content to display, so they want to extend the SplashScreen until the data is ready.

But personally, I don't think this is a very appropriate approach, in which case we can first display a loading progress bar on the interface, or occupy a bitmap or something like that, and then update the interface after we have the data.

Another theory is that they hope that SplashScreen can be used not only to load and wait, but also to do things like brand display and promotion. In this way, if SplashScreen disappears too quickly, users may not have time to see the content on SplashScreen at all.

Of course, there is another saying that what they show on SplashScreen is not a static icon, but an animation, so at least wait until the animation is over before hiding the SplashScreen.

No matter which type you belong to, Google provides us with the ability to extend the display of SplashScreen.

As I just said, SplashScreen will disappear automatically when App starts to draw the first frame on the interface, so if we prevent App from drawing the first frame on the interface, won't SplashScreen disappear?

Yes, that's how the extended display SplashScreen works. The specific code is as follows:

Class MainActivity: AppCompatActivity () {override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) setContentView (R.layout.activity_main) val contentView: View = findViewById (android.R.id.content) contentView.viewTreeObserver.addOnPreDrawListener (object: ViewTreeObserver.OnPreDrawListener {override fun onPreDraw (): Boolean {return false}})}}

Here we return a false in the callback function onPreDraw (), which means that our PreDraw phase is never ready. Since PreDraw is not ready, App will not start drawing the first frame, so SplashScreen will not disappear.

So the above code will achieve the effect of permanently displaying SplashScreen.

With this principle, we can write some logic according to our own needs. For example, in the scenario of reading data from disk just mentioned, we can first return false in the function onPreDraw (), then start a child thread to read the data, and then change the return value to true when the data reading is complete. The sample code is as follows:

Class MainActivity: AppCompatActivity () {@ Volatile private var isReady = false override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) setContentView (R.layout.activity_main) val contentView: View = findViewById (android.R.id.content) contentView.viewTreeObserver.addOnPreDrawListener (object: ViewTreeObserver.OnPreDrawListener {override fun onPreDraw (): Boolean {if (isReady) { ContentView.viewTreeObserver.removeOnPreDrawListener (this)} return isReady}}) thread {/ / Read data from disk... IsReady = true}

Notice that the onPreDraw () function is constantly refreshed at a high frequency during the display of the SplashScreen. So it still blocks the main thread, causing the application to fail to respond to user input events and will not stop refreshing until we return true in the onPreDraw () function.

Customize SplashScreen styl

Then we finally come to the part that many friends are most concerned about, customizing the style of SplashScreen.

Although the default SplashScreen interface is not ugly and may be sufficient for most App, Google still gives us a high degree of control to customize the style of SplashScreen.

Here I will introduce a few more important custom style attributes to you.

As mentioned earlier, SplashScreen defaults to using the color specified by the windowBackground property as the background color of the interface. But what if I want to assign a background color to the SplashScreen interface separately? The following properties can be defined in the topic file:

# CCCCCC

Here, we separately specify the background of the SplashScreen as light gray, and the effect is shown below:

It is important to note that this property and all the properties to be introduced next are new to the Android 12 system, so you should use them in a dedicated directory of values-v31.

Now that we can customize the background color of SplashScreen, can we also customize the icons on SplashScreen?

It's hard to imagine why we should display a different icon on the SplashScreen interface than Launcher Icon, but Google does allow us to do this:

@ drawable/splash_screen_icon

Here we assign a separate icon to the SplashScreen interface. Note that this icon can be either a static image or an animation resource. Because of the complexity of making animation, it is not within the scope of this article, so we only use static pictures as an example.

I prepared such a picture and named it splash_screen_icon.jpg.

Then run the program, and the effect is shown in the following figure:

You will find that although the icon I provided is square, what is finally displayed on SplashScreen is a circular image.

From this, we can conclude that SplashScreen, like Launcher Icon, is also affected by the manufacturer's mask. Its general working principle is shown in the following figure:

As you can see, the background layer is a blue grid, and the foreground layer is a Logo picture of the Android robot, then covered with a circular mask, and finally cut out a circular application icon.

If you don't know enough about this, you can refer to an article I wrote earlier about application icon adaptation in the Android 8.0 system.

In the above example, I use an opaque image as the icon, in fact, we can also provide a transparent picture, and then use the following properties to control the background color of the icon:

# BB86FC

In this way, as long as the foreground icon is a transparent picture, the background color can be displayed, as shown in the following image:

Finally, if you want to do some more brand promotion on SplashScreen, you can also display your brand information through the following attributes:

@ drawable/brand_logo

A brand image can be passed in here. I can't find Google's definition of the size ratio of this image on the official website, but if you pass in a random image, it may stretch.

To this end, through my own experiments, I roughly summed up that we should use a 2.4 rig 1 picture here, and the final effect is as follows:

Adapt to the old version of SplashScreen

Finally, let's take a look at how to adapt to the old version of SplashScreen.

To be exact, Android officially does not have the old version of SplashScreen, because SplashScreen is a new addition in Android 12.

However, many App have implemented SplashScreen functionality on their own long before API is officially available. As mentioned earlier, this function is very common in China.

So here comes the question. How can SplashScreen, which was implemented in its own way in the past, be compatible with the official SplashScreen now?

This is really a problem, mainly because SplashScreen is mandatory on Android 12. So, if you still have the same set of SplashScreen that you implemented in the past, there will be a double SplashScreen in Android 12.

But if we remove the SplashScreen that we implemented in the past from the code, then the system version before Android 12 will have no SplashScreen functionality.

How to solve this problem? Don't worry, Google provides a backward compatible SplashScreen library in AndroidX. According to the official statement, we only need to use this library to easily solve the adaptation problem of the old version of SplashScreen.

The usage is simple, just follow the steps below.

The first step is to modify the build.gradle file, specify targetSdkVersion to 31, and add the following dependent libraries:

Android {

CompileSdkVersion 31

...

}

Dependencies {

...

Implementation 'androidx.core:core-splashscreen:1.0.0-alpha01'

}

The second step is to modify the theme file as follows:

# CCCCCC @ drawable/splash_screen_icon @ style/Theme.SplashTest

Note that the changes here are crucial. We have defined a new theme, which can be called anything, but it must be inherited from Theme.SplashScreen.

Then we can use the windowSplashScreenBackground and windowSplashScreenAnimatedIcon properties to specify the background color and the center icon of the SplashScreen, respectively.

But what puzzles me is that we can't specify the background color and brand image of the icon in the SplashScreen interface as we did just now, because there are no such two attributes here. I don't know if it's because the library still has properties at an early stage, and these attributes may be added later.

In addition, we must specify the postSplashScreenTheme attribute and specify its value as the original theme of your App. In this way, when the SplashScreen ends, your theme can be restored without affecting the look and feel of your App theme.

The third step is to modify the AndroidManifest.xml file and apply the theme we just defined:

...

It depends on how your previous code is written to decide whether to replace the theme in the application title or the theme in the activity title.

Step 4, add the following code to your startup Activity:

Class MainActivity: AppCompatActivity () {override fun onCreate (savedInstanceState: Bundle?) {super.onCreate (savedInstanceState) installSplashScreen () setContentView (R.layout.activity_main)...}}

If you are still using the Java language, you need to change it to the following:

Public class MainActivity extends AppCompatActivity {@ Override protected void onCreate (Bundle savedInstanceState) {super.onCreate (savedInstanceState); SplashScreen.installSplashScreen (this); setContentView (R.layout.activity_main);...}}

Note that the code installSplashScreen () must be added before setContentView ().

In this way, when we first enter the App, we will first display a SplashScreen interface, and then when the App is initialized, the SplashScreen will automatically disappear, and the theme will become the original App theme style.

Next, we just need to remove the SplashScreen that we implemented in the past, otherwise there will still be a double SplashScreen.

The above steps are officially provided to adapt to the old version of SplashScreen solution, but I followed the above steps to implement, the final test results are very poor.

The main problem is that the central icon will not be mask on the old Android system, while the central icon will be mask on Android 12, which makes the SplashScreen interface of the old and new systems very different and ugly.

But after all, the SplashScreen library we use now is still in the alpha stage, and there is a good chance that it will change later, and maybe these problems will be fixed after the official version.

In addition, even if there is something wrong with the official library, we still have a way to avoid it. For example, to make a logical judgment in the code, if it is an Android 12 system, it does not display its own SplashScreen interface, because the system has a default SplashScreen. Systems below Android 12 display their own SplashScreen interface.

At this point, I believe you have a deeper understanding of "what is the SplashScreen of Android". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.