Android中怎么實現一個沉浸式狀態欄

Android中怎么實現一個沉浸式狀態欄，很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細講解，有這方面需求的人可以來學習下，希望你能有所收獲。

導航欄問題

在Android中，頂部導航欄目前常用的兩種實現方式，一個是通過Toolbar，一個是通過自定義View的方式來實現。兩種方式各有利弊。Toolbar為官方指定規范，開發者使用更方便，但可拓展性差，對于一些特殊的展示效果無法實現，而通過自定義方式的方式，可以支持更多展示效果，但卻需要我們寫更多的代碼。兩種方式在實現狀態欄沉浸上也有所差別。

去掉Title

• Toolbar默認主題會具有一個title，當我們使用Toolbar的時候，而沒有去掉title，應用則會crash，報出如下所示錯誤。 

因此在使用Toolbar 的時候，我們需要style中添加如下屬性配置

<item name="windowNoTitle">true</item>

當然我們也可以通過代碼動態去掉title，但當我們的主題從Theme.AppCompat作為父類繼承的時候，通過代碼并不可以去掉title。

自定義導航欄

當我們未設置windowNoTitle屬性的時候，在導航欄之上有title。顯然和我們要實現導航欄的沉浸式有所違背，因此實現對于導航欄的沉浸，

<item name="windowNoTitle">true</item>該配置是必不可少的。

設置狀態欄透明

去掉title之后，是否我們就可以實現上述的效果了呢?

這個時候，我們發現狀態欄還是黑色，并沒有沉浸，需要我們將狀態欄設置為透明。

<item name="android:windowTranslucentStatus">true</item>

該屬性只有在在4.4和高于4.4版本上可以進行該屬性的配置，但是在更低版本上則無法使用。配置該屬性之后，執行效果如下圖所示。

解決導航欄上移問題

這個時候，Toolbar被整體上移了，導致其部分功能也進入了狀態欄之下，包括導航欄的內容也到了狀態欄位置之中，顯然這是不符合我們最初的要求的。如何解決這個問題?我們在Toolbar中添加fitSystemWindows屬性，即可使得toolbar的上部空出一個高度，使得Toolbar內容部分脫離狀態欄。

<android.support.v7.widget.Toolbar        android:id="@+id/toolbar"        android:fitsSystemWindows="true"        android:layout_width="match_parent"        android:layout_height="wrap_content">    </android.support.v7.widget.Toolbar>

得到我們最終想要得到的效果

自定義導航欄與之實現類似。

fitsSystemWindows屬性

前面對Toolbar的設置是在Toolbar中添加的fitSystemWindows屬性，那么當我們將其屬性添加到Toolbar所在的最外層的布局會怎么樣呢?

<RelativeLayout     xmlns:android="http://schemas.android.com/apk/res/android"     xmlns:tools="http://schemas.android.com/tools"     android:id="@+id/activity_toolbar"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:fitsSystemWindows="true" tools:context="com.example.netease.toolbardemo.activity.ToolbarActivity">      <android.support.v7.widget.Toolbar         android:id="@+id/toolbar"         android:layout_width="match_parent"         android:layout_height="wrap_content">     </android.support.v7.widget.Toolbar>  </RelativeLayout>

執行之后，可以看到和之前未設置狀態欄透明時的效果相同。

那么這個fitSystemWindows工作的原理是什么呢?通過上述實驗，不難發現，對于沉浸狀態欄的控制，該屬性起到了一個很關鍵的作用。

接下來通過一個實驗來驗證下，該屬性所起的作用，在Toolbar所在的布局中，在布局的底部添加一個Button.

<android.support.v7.widget.Toolbar         android:id="@+id/toolbar"         android:fitsSystemWindows="true"         android:layout_width="match_parent"         android:layout_height="wrap_content">     </android.support.v7.widget.Toolbar>      <Button         android:text="Test"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:background="@color/colorAccent"         android:layout_alignParentBottom="true"/>

當我們將該屬性設置到按鈕上，又會發生什么呢?

<Button        android:text="Test"        android:fitsSystemWindows="true"        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:background="@color/colorAccent"        android:layout_alignParentBottom="true"/>

通過比較可以很明顯的看出，設置了fitsSystemWindows屬性的View在其上部被設置了一個padding。根據之前做的實驗，我們可以知道當我們設置了窗口狀態欄透明之后，整個內容視圖會向上移動了一個狀態欄的高度，而當前為該View增加的padding的大小是不是和其高度相同呢?

Button btn = (Button) findViewById(R.id.test_btn);  Log.i("padding", btn.getPaddingTop()+"");  Rect frame = new Rect();  getWindow().getDecorView().getWindowVisibleDisplayFrame(frame);  Log.i("height", frame.top+"");

獲取按鈕的padding高度和狀態欄的高度，我們可以得到如下日志。

通過實驗我們可以得出結論，fitSystemWindows屬性會對所設置的View增加一個top  padding，因此當我們在實現讓導航欄沉浸的時候，設置窗口狀態欄的透明會使得視圖整體上移，而借助fitSystemWindows屬性的功能，為視圖中最頂部的View設置一個和狀態欄高度相同的padding，使得導航欄不會被頂到狀態欄內。

當我們在一個視圖中，多個View設置該屬性時，發現只有***個設置該屬性的View會起作用，在視圖布局上，自上而下的***個View其作用。層級上則為最***的View上首先其作用。因此其功能歸納為：

• 為設置該屬性的View增加一個和狀態欄高度相同的toppadding

• 當視圖中有多個View被設置了該屬性，那么只布局上最頂部的View起作用

5.0及其以上

至此，我們可以***的實現一個狀態欄的沉浸，上述的實現是在Android  4.4版本上，在視圖的最上部，會有一個黑色漸變的陰影，而在5.0設備上的展示效果如下所示，在狀態欄上整個都會有一個陰影。當然不同廠家對此也有自己的一些優化，比如魅族在4.4上是不具有陰影的。

對于5.0及其之上，官方提供了對狀態欄顏色控制的相應API，我們可以通過代碼來控制狀態欄的顏色，實現如下效果。

實現代碼

if(Build.VERSION.SDK_INT >= 21) {             Window window = getWindow();             //取消設置透明狀態欄,使 ContentView 內容不再沉浸到狀態欄下             window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);             //需要設置這個 flag 才能調用 setStatusBarColor 來設置狀態欄顏色             window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);             //設置狀態欄顏色             window.setStatusBarColor(getResources().getColor(R.color.yx_red));         }

看完上述內容是否對您有幫助呢？如果還想對相關知識有進一步的了解或閱讀更多相關文章，請關注億速云行業資訊頻道，感謝您對億速云的支持。