Android Immersion status bar Micro tip (take you to a real understanding of immersion mode) _android

In fact, when it comes to immersion status bar this name I also feel very helpless, I really do not know who this term is first launched. Because the Android authorities never gave a name like the immersive status bar, only the immersive mode. And some people, without fully understanding what the immersion model is, confusedly that some system-supplied status bar operations are immersive and also have an immersive status bar name.

For example, there was a QQ group friends asked me, like hungry? How can this immersion status bar effect be achieved?

The effect is that the background image can take advantage of the system status bar space, so that the background map and the status of the bar to integrate.

In this article I will teach you how to achieve this effect, but this is not really called immersion status bar. Therefore, this is a technology + popularization of the article, talk about technology at the same time to correct the people before the wrong name.

What is an immersion?

First of all, to analyze the reason for the wrong, the reason many people will be called wrong, is because they do not understand what the immersion means, and then follow the following call. So what exactly does the immersion mean?

According to the definition of Baidu Encyclopedia, immersion is to provide users with full immersion experience, so that users have a kind of exposure in the virtual world of feeling.

For example, the current big-hot VR is the main immersion experience.

So what is an immersive experience for the Android operating system? This may not be available in most cases, but it is important to play a game or watch a movie. Because the game or film and television applications are expected to let users completely immersed in the enjoyment of their entertainment content, but if the screen at the top of the display of a system status bar, it may give users a minute to produce the feeling of the play.

So let's take a look at how good games are achieved, such as the islands:

This model of the island is a typical immersion mode, its entire screen display is the content of the game, no status bar and no navigation bar, users play the game can be completely immersed in the game, without being disturbed by the interface elements of some systems.

And then we'll look at the realization of Archie:

Similarly, Archie Art will be the entire screen as a film and television display area, users in the eyes of the film will only have the content of the film, so that there will not be some other unrelated things distracted.

This is the immersion mode of the real meaning, and what the so-called immersion status bar is simply barking, completely do not understand the "immersion" of the three words what meaning.

But although it sounds like a big, immersive effect, it actually looks like the full screen of the content. Yes, the essence of Android immersion mode is Full-screen, but today's content is not limited to this, because we want to achieve the status bar effect hungry. So let's start with a step-by-step study.

Hide Status bar

The interface of an Android application actually has a lot of system elements, look at the following figure:

As you can see, there are status bars, Actionbar, navigation bars, and so on. The user experience of creating immersive mode is to hide these system elements, leaving only the main content part.

Let's say I created a new empty project now, then modify the code in the layout file and add a imageview inside it, as follows:

<relativelayout xmlns:android= "http://schemas.android.com/apk/res/android" android:layout_width= "match_parent "android:layout_height=" match_parent ">
<imageview android:layout_width=" Match_parent "Android:layout_ height= "Match_parent" android:src= "@drawable/bg" android:scaletype= "Centercrop"/>
</RelativeLayout>

Here the width and height of the ImageView are set to Match_parent, allowing the picture to fill the screen. Now run the program and the effect is shown in the following illustration.

If you understand the picture as a game or a movie, then the experience is too far away from the immersion, at least the status bar and Actionbar have to hide it? It doesn't matter, we step through the optimization, and learn in the optimization.

Hiding the status bar and Actionbar in the 4.1 system is different from the 4.1 system, and I'm not prepared to consider compatibility under the 4.1 system because older systems simply do not offer immersive experience support.

Modify the code in the mainactivity as follows:

public class Mainactivity extends Appcompatactivity {
@Override
protected void OnCreate (Bundle Savedinstancestate) {
super.oncreate (savedinstancestate);
Setcontentview (r.layout.activity_main);
View Decorview = GetWindow (). Getdecorview ();
int option = View.system_ui_flag_fullscreen;
decorview.setsystemuivisibility (option);
Actionbar Actionbar = Getsupportactionbar ();
Actionbar.hide ();
}

This first invokes the GetWindow () Getdecorview () method to obtain the Decorview of the current interface, and then calls its setsystemuivisibility () method to set the visibility of the system UI element. Where System_ui_flag_fullscreen represents the full screen meaning, which is to hide the status bar. Also, according to the Android design proposal, Actionbar should not be displayed separately from the status bar, so if the status bar is hidden, we also need to call the Actionbar Hide () method to hide Actionbar.

Now rerun the program, as shown in the following image.

This looks like a bit of an immersive effect.

Although this is the Orthodox immersion meaning, but some friends may want to achieve is hungry for the status bar effect, rather than directly to the entire system status bar to hide, then how to achieve it?

In fact, it is also very simple, just need to use another kind of UI flag, as follows:

Super.oncreate (savedinstancestate);
Setcontentview (r.layout.activity_main);
if (Build.VERSION.SDK_INT >=) {
View Decorview = GetWindow (). Getdecorview ();
int option = View.system_ui_flag_layout_fullscreen
| view.system_ui_flag_layout_stable;
decorview.setsystemuivisibility (option);
GetWindow (). Setstatusbarcolor (color.transparent);
Actionbar Actionbar = Getsupportactionbar ();
Actionbar.hide ();

First of all, you need to pay attention. This effect is only 5.0 and above the system to support, so here is a layer of if judgment, only the system version is greater than or equal to 5.0 when the following code is executed.

Next we use System_ui_flag_layout_fullscreen and system_ui_flag_layout_stable, and note that two FLAG must be used together, which means that the subject content of the application occupies the space of the system status bar. , and finally call the window's Setstatusbarcolor () method to set the status bar to Transparent.

Now rerun the code and the effect is shown in the following illustration.

As you can see, the status bar effect, similar to the hungry, has been successfully implemented.

Again, this effect is not called immersion status bar, there is no immersion status bar This argument, we estimate and can call it transparent status bar effect bar.

Hide Navigation Bar

Now we have successfully implemented the effect of hiding the status bar, but the navigation bar under the screen is still more dazzling, next we will learn how to hide the navigation bar.

In fact, the principle of implementation is the same, the hidden navigation bar is using a different UI flag just to modify the code in the Mainactivity, as follows:

Super.oncreate (savedinstancestate);
Setcontentview (r.layout.activity_main);
View Decorview = GetWindow (). Getdecorview ();
int option = View.system_ui_flag_hide_navigation
| View.system_ui_flag_fullscreen;
decorview.setsystemuivisibility (option);
Actionbar Actionbar = Getsupportactionbar ();
Actionbar.hide ();

Here we use both system_ui_flag_hide_navigation and system_ui_flag_fullscreen, so that the status bar and the navigation bar can be hidden at the same time. Now rerun the program, as shown in the picture.

It looks like it's finally full screen, but it's still a little bit far from the real immersion model, because in this mode, any position we touch on the screen will exit the full screen.

This is obviously not the effect we want, so the usage scenario for this pattern is relatively limited.

In addition to hiding the navigation bar, we can also achieve the same as the transparent status bar similar to the effect of making a transparent navigation bar:

Super.oncreate (savedinstancestate);
Setcontentview (r.layout.activity_main);
if (Build.VERSION.SDK_INT >=) {
View Decorview = GetWindow (). Getdecorview ();
int option = View.system_ui_flag_layout_hide_navigation
| View.system_ui_flag_layout_fullscreen
| view.system_ui_flag_layout_stable;
decorview.setsystemuivisibility (option);
GetWindow (). Setnavigationbarcolor (color.transparent);
GetWindow (). Setstatusbarcolor (color.transparent);
Actionbar Actionbar = Getsupportactionbar ();
Actionbar.hide ();

This uses system_ui_flag_layout_hide_navigation, which means that the subject content of the application occupies the space of the system navigation bar, and then calls the Setnavigationbarcolor () method to set the navigation bar to a transparent color. Now rerun the program, as shown in the following image.

The real immersion mode

Although the immersed navigation bar is a name that many people mistakenly call, the immersion mode does exist. So how can we achieve immersive patterns like island-Archie and art?

First you should make sure that you really need this feature, because in addition to special applications like gaming or video software, most applications do not use immersion mode.

When you're sure you want to use immersion mode, you just need to rewrite the onwindowfocuschanged () method of the activity, and then add the following logic:

public class Mainactivity extends Appcompatactivity {
@Override
protected void OnCreate (Bundle Savedinstancestate) {
super.oncreate (savedinstancestate);
Setcontentview (R.layout.activity_main);
}
@Override public
void Onwindowfocuschanged (Boolean hasfocus) {
super.onwindowfocuschanged (hasfocus);
if (Hasfocus && Build.VERSION.SDK_INT >=) {
View Decorview = GetWindow (). Getdecorview ();
Decorview.setsystemuivisibility (
view.system_ui_flag_layout_stable
| View.system_ui_flag_layout_hide_navigation
| View.system_ui_flag_layout_fullscreen
| View.system_ui_flag_hide_navigation
| View.system_ui_flag_fullscreen
| View.system_ui_flag_immersive_sticky);}}

Immersion mode UI Flag there is nothing to explain, if you need to implement immersive mode, just copy the above code to the past. It should be noted that only the Android 4.4 and above systems support immersion mode, so it is also added to the If judgment.
In addition, to make our interface look more like a game, here I set the mainactivity to horizontal screen mode:

<activity android:name= ". Mainactivity "android:screenorientation=" Landscape "> ...
</activity>

In this way, we realize the immersive mode effect similar to that of the island's Archie and the sea-art, as shown in the following figure.

As you can see, the interface is full-screen by default, and the status bar and navigation bar are not displayed. And when we need to use the status bar or navigation bar, just pull down at the top of the screen, or on the right side of the screen to Zola, the status bar and navigation bar will be displayed, at this time the interface of any element of the display or size will not be affected. After a period of time, if there is no action, the status bar and navigation bar will automatically hide, back to Full-screen state.

This is the most standard immersion mode.

The above is a small set to introduce the Android immersion status bar micro skills (with you really understand immersion mode), I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!