Android implements the color-changing status bar and android color-changing status bar

Android implements the color-changing status bar and android color-changing status bar

First, we need to know what is the transparent status bar and what is the immersive status bar, and the difference. In China, the transparent status bar is called the immersive status bar, but the two are essentially different.

Let's first look at what an immersive mode is.

In Android 4.4, the Immersive experience is enhanced again, providing a "Full-screen Immersive Mode ). There are two full-screen modes: Lean Back and Immersive ). Withdrawal has been widely used in earlier systems-when you watch videos in Youku apps, most of the time your fingers won't touch the screen. In this case, the virtual keys and status bar are automatically hidden, but they appear again when you touch the screen. The newly added immersive mode is not the same. In the immersive full screen mode, screen operations will not be triggered. To pull the system bar, you must drag it from the top or bottom of the screen to the screen. Immersive full screen is more suitable for games and applications like reading.

However, the difference between the immersive mode and the normal full screen mode is that the virtual key and status bar can be called up at or below the screen by sliding down.
For example, you can read more in full screen mode in immersive mode.

Then move down or down from the top of the screen, and the virtual key and status bar appear. But it is directly covered in the program text.

The source of the immersive status bar is that many mobile phones use solid buttons without virtual keys. When the immersive mode is enabled, the status bar disappears. So the immersion mode becomes the immersive status bar.

A very important change in Android 4.4 Is the transparent system bar .. The new system Bar is gradient and transparent, allowing the screen to display more content to the maximum extent, or integrating the system Bar and Action Bar, leave only the minimum background protection to prevent the content of the notification Bar and the Action Bar text/icon from being difficult to recognize. Google calls this effect Translucent Bar.

Translucent Bar is one of Android's attempts to use Edge to Edge and is most easily noticed by users. Its initial goal is to maximize the visible area and reduce the presence of the system interface.

In fact, simply put, the layout is extended to the status bar. The background of the status bar is the same as that of the application.* Transparent status bar *. The most direct example is the weather interface of the UC browser. Its layout is extended to the status bar, but the status bar is the same as the background of the application,

However, sometimes the color of the status bar is the same as the background color of the application, but the color of the status bar is actually changed.Color changing status bar

Currently, QQ and other software are used, and the status bar is integrated with the software color, which is actually a color-changing status bar. Xiaomi MIUI's built-in applications are both color-changing status bars or transparent status bars, rather than immersive status bars.

Here we refer to the color-changing status bar as a transparent status bar. This article will show you how to implement this transparent status bar.

Because this effect is only effective at 4.4 and above, the effect of this article is only effective at 4.4 and above.

First, apply the topic

        " data-snippet-id="ext.7aa43b0f8d91da8238f865c9576446df" data-snippet-saved="false" data-codota-status="done"><resources>    <style name="AppTheme" parent="@style/BaseTheme">    </style>    <style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>    </style></resources>

Then we create a values-v19 directory under res, representing the lowest API is 19, create a style. xml, the following code is the key to transparent Status Bar

    " data-snippet-id="ext.6d530167ba32f626785eebb613c33747" data-snippet-saved="false" data-codota-status="done"><resources>    <style name="AppTheme" parent="@style/BaseTheme">        <item name="android:windowTranslucentNavigation">true</item>        <item name="android:windowTranslucentStatus">true</item>    </style></resources>

The ActionBar of the system is disabled and replaced by ToolBar. The layout code is as follows:

<LinearLayout    xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <android.support.v7.widget.Toolbar        android:id="@+id/toolbar"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="?attr/colorPrimary"        android:fitsSystemWindows="true"        ></android.support.v7.widget.Toolbar></LinearLayout>

After careful consideration, you will find that the Toolbar has been addedAndroid: fitsSystemWindows = "true"Attribute, which is to extend the layout to the status bar. When you run this command, you will find that the Toolbar is moved to the position of the status bar. The height of the move-up is the height of the status bar.

But we don't want to move it to the top, just want it to have the same color as the Toolbar, how to do it is very simple, in the Code throughSetsuppactionactionbarSet the location of the ActionBar.

Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);setSupportActionBar(mToolbar);

The effect is as follows.

Obviously, the ToolBar is the previous height, but the status bar also changes color.

But how can we satisfy this problem. On Android 5.0, the color of our status bar is darker than that of Toolbar. Just like this.

We need to further modify it. We need to color the status bar. here we need to use an Open Source library SystemBarTint.

Add dependency

  compile 'com.readystatesoftware.systembartint:systembartint:1.0.3'

Add the following code after setting the Layout

SystemBarTintManager tintManager=new SystemBarTintManager(this);tintManager.setStatusBarTintResource(R.color.colorPrimaryDark);tintManager.setStatusBarTintEnabled(true);

The final result is as follows:

Of course, there are many functions in this library. Let's take a look at the specific functions, and its internal source code is not complicated. We suggest you check its source code implementation.

The source code in this article is simple, so you won't be able to access the source code.

Copyright Disclaimer: This article is an original article by the blogger and cannot be reproduced without the permission of the blogger.