此文章裝載至http://www.androidchina.net/3520.html點擊打開鏈接

一、

首先我們得了解什么是透明狀態欄以及什么是沉浸式狀態欄，以及其區別，國內習慣稱透明狀態欄為沉浸式狀態欄，但是兩者是有本質區別的。

先來看看什么是沉浸式模式。

Android 4.4中，沉浸式體驗得到了再次強化，提供了一種“全屏模式”(Full-screen Immersive Mode)。全屏模式又分兩種，一種叫后撤式 (Lean Back)，另一種叫做沉浸式(Immersive)。后撤式已經在之前的系統中被廣泛使用了——當你在優酷APP中觀看視頻時，大部分時間手指是不會去碰屏幕的。這種情況下，虛擬鍵和狀態欄都會自動隱藏，但當你觸摸屏幕的時候，它們又會出現。而新加入的沉浸式則不太一樣，在沉浸式全屏狀態下，對屏幕的操作并不會喚出系統欄。想要喚出系統欄，你必須從屏幕的上/下邊緣向屏幕內劃入。沉浸式的全屏狀態更適合游戲和閱讀這樣的應用。

但沉浸模式和普通全屏不同點在于，沉浸模式通過下滑屏幕上方或者下方可以調出虛擬鍵和狀態欄。

比如多看閱讀，下圖是在閱讀時沉浸模式下全屏。

然后從屏幕上方下滑或者下方上劃，虛擬鍵和狀態欄出現了。但卻是直接覆蓋在程序文字上的。

而沉浸式狀態欄的來源就是很多手機用的是實體按鍵，沒有虛擬鍵，于是開了沉浸模式就只有狀態欄消失了。于是沉浸模式成了沉浸式狀態欄。

Android 4.4 一個很重要的改變就是透明系統欄.。新的系統欄是漸變透明的, 可以最大限度的允許屏幕顯示更多內容, 也可以讓系統欄和 Action Bar 融為一體, 僅僅留下最低限度的背景保護以免通知通知欄內容和 Action Bar 文字/圖標難以識別。谷歌把這種效果稱之為：Translucent Bar。

Translucent Bar 是 Android 對 Edge to Edge 嘗試中的一個, 也是最容易被用戶注意到的. 它的初始目的就是要最大化可視面積和淡化系統界面的存在感。

其實簡單一點就是布局延伸到狀態欄，狀態欄背景與應用背景相同，這就是*透明狀態欄*。最直接的例子就是UC瀏覽器的天氣界面，其布局延伸到狀態欄，但是狀態欄與應用同背景，如圖所示

但是這樣有時候會把狀態欄顏色變得和應用的背景顏色一樣，但是實際上只是修改了狀態欄的顏色，我們稱它為變色狀態欄

而現在大家所在用的QQ等軟件，狀態欄與軟件顏色融為一體，其實就是變色狀態欄。而小米MIUI的自帶應用，也都是變色狀態欄或者是透明狀態欄，而并非是沉浸式狀態欄。

這里我們姑且稱變色狀態欄為透明狀態欄的一種，本篇文章就是帶大家實現這種透明狀態欄。

由于這種效果只有在4.4及以上有效，所以本篇文章的效果只有在4.4及以上有效。

首先應用主題

1 2 3 4 5 6 7 8 9 10 11

<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>

然后我們在res下新建一個values-v19的目錄，代表最低API為19，新建一個style.xml，下面的代碼是透明狀態欄的關鍵

1 2 3 4 5 6 7 8

<resources> ????<style name="AppTheme" parent="@style/BaseTheme"> ????????<item name="android:windowTranslucentNavigation">true</item> ????????<item name="android:windowTranslucentStatus">true</item> ????</style> </resources>

我們禁用了系統的ActionBar，使用ToolBar代替，布局代碼如下

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

<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>

細心的你會發現在Toolbar中加入了android:fitsSystemWindows=”true”屬性，這就是將布局延伸到狀態欄，這時候你運行一下，會發現Toolbar上移到了狀態欄的位置。上移的高度剛好是狀態欄的高度。

但是我們并不想它移動到上面，只是想它狀態欄和Toolbar顏色一樣，要怎么做的，很簡單，在代碼中通過setSupportActionBar設置到ActionBar的位置即可。

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

之后的效果就是這樣的。

很明顯的看到，ToolBar就是之前的高度，但是狀態欄也變色了。

但是我們又怎么能滿足于此呢。在Android 5.0上，我們的狀態欄的顏色是要比Toolbar的顏色要深的。就像這樣。

我們還要進一步修飾，需要對狀態欄著色，這里需要用到一個開源庫SystemBarTint

加入依賴

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

之后再設置布局后加入以下代碼

1 2 3

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

最終效果就是上圖所示

當然這個庫里還有很多函數，具體功能自己去琢磨吧，并且其內部源碼也并不復雜，建議還是看下其源碼實現。

總結

以上是生活随笔為你收集整理的Android的沉浸式状态栏与变色状态栏详解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。