Full Version adaptation solution for SystemBar status bar based on Android Best Practices

Full Version adaptation solution for SystemBar status bar based on Android Best Practices
Preface

Since the MD design specifications come out, the adaptation to the system status bar has been paid more and more attention, because MD changed the color of the system status bar after 5.0 to something that can be configured by developers, the status bar color cannot be specified before 5.0, so this article describes how to use Toolbar to adapt to the status bar of the system.

Adaptation of mainstream apps

Q is very well adapted in this aspect. It combines the title bar and the status bar, and has the same effect as iOS, as shown below:

4.4, 5.0 +

Earlier than 4.4

If the version is earlier than 4.4, It is the default black status bar, because the status bar cannot be changed or configured under 4.4.

The adaptation of mobile Q retains consistent UI effects for all versions above 4.4. Even in versions above 5.0, the status bar effects of the md style are discarded.
The status bar begins to adapt to the MD style for the status bar above 5.0, but does not adapt to the status bar below 5.0. The status bar is still the default black color of the system. The following figure shows the effect of the 5.0 + system:

Use Toolbar for full-version adaptation

Based on the above adaptation effect, we can adapt as follows:

The system below 4.4 uses the default status bar of the system. The status bar and the title bar are combined on the system at 4.4. The system above 5.0 has two options:
1. continue to use the 4.4 Effect, just like Q
2. compatible with the MD Style

The following are the adaptation results:

First: 4.4 or less Systems

4.4 On the system:

5.0 + Systems

Second: 4.4 On the following systems:

4.4 On the system:

5.0 + Systems

Implementation First

In the style file, set the transparent status bar windowTranslucentStatus to true for 4.4 or above, or in the code, define a BaseActivity:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {            // Translucent status bar            getWindow().setFlags(                    WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS,                    WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);        }

In the layout file, set the Toolbar:

android:fitsSystemWindows="true"android:minHeight="?attr/actionBarSize"

This is crucial. You can generally divide the Toolbar layout into a layout file for reuse later.

1. values:

2, values-v19:

3, values-v21:

4. layout:

ImageView is added in the RecyclerView Header

<code class=" hljs avrasm">   <android.support.design.widget.coordinatorlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent">    <android.support.v7.widget.recyclerview android:id="@+id/recycle_view" android:layout_width="match_parent" android:layout_height="match_parent">    <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:minheight="?attr/actionBarSize" android:theme="@style/AppTheme.AppBarOverlay" app:popuptheme="@style/AppTheme.PopupOverlay">        <textview android:id="@+id/title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textsize="20sp">        <imageview android:id="@+id/img" android:layout_width="48dp" android:layout_height="?attr/actionBarSize" android:layout_gravity="right" android:clickable="true" android:scaletype="centerInside" android:src="@android:drawable/stat_sys_headset">    </imageview></textview></android.support.v7.widget.toolbar></android.support.v7.widget.recyclerview></android.support.design.widget.coordinatorlayout></code>

Second

In general, like the first one, the difference is the content of the values-v21.

1. values:

2, values-v19:

3, values-v21: