寫在前面
最近新開了個專案,準備花點時間做一下,不過文也不能少,一週一篇是最起碼的了。關於沉浸式狀態列,網上的教程應該是非常非常多的,那麼我為什麼還要發呢?很簡單,有些東西我記不大住,所以都發到我的簡書上,以後我就不用到處去找了,麻煩~
自定義頂部佈局的沉浸式狀態列
什麼叫自定義頂部佈局呢?這個要首先解釋一下,處於一些原因的考慮,有一些專案可能不願意使用Toolbar或者ActionBar,進入Activity的第一件事情就是:
requestWindowFeature(Window.FEATURE_NO_TITLE);
複製程式碼
或者
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
複製程式碼
直接把頂部幹掉,然後換上自己的頂部佈局。對於這樣的情況,先看一下實現之後的狀況
![沉浸式.png](https://i.iter01.com/images/3e62f649afcc706fa921701a8d5e0dab12155fede5c4590f7319faac9ad5dda2.png)
效果好像還可以,那麼究竟該怎麼實現呢?
Android5.0 LOLLIPOP
為什麼先講Android5.0(API 21)呢,因為Android5.0之後可以直接改變狀態列的顏色,所以實現起來比較方便,先看一下xml配置實現的方法。
![values21.png](https://i.iter01.com/images/31594075a9c3d75af4d70c8d453533821f523df1fd5a99d40f307b5e2a4a316f.png)
首先我們需要新建一個values-v21,然後新建styles,程式碼如下
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:windowTranslucentStatus">true</item>
<item name="android:statusBarColor">#f13f00</item>
</style>
</resources>
複製程式碼
之後跑出來的效果就是上面的圖的樣子了,但是,這並沒有什麼用。
![並沒有什麼卵用](https://i.iter01.com/images/34f532d3fce0cd7c6f018f188ad74bb7781ba2f8ab4ebd9c1b47f48fecf06113.jpg)
![分佈圖.png](https://i.iter01.com/images/273ea2072b9ab2ba1d562bb51368bb49bd9d189f29ddab4567141bec7013c9d9.png)
5.0版本以下的使用者不可忽視,但是5.0以下的版本並沒有可以改變狀態列顏色的方法,不過4.4(API 19)版本是可以將狀態列顏色設定為透明的,我們可以根據這一特性得出一些沉浸式狀態列的解決方案,而且我個人也比較推薦採用4.4及以上的這種解決方案。
Android4.4 KITKAT
首先和上面差不多,在res下新建values-v19這個資料夾,然後新建styles檔案,程式碼如下:
<resources>
<style name="ImageTranslucentTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:windowTranslucentStatus">true</item>
</style>
</resources>
複製程式碼
這裡我僅僅是設定了透明狀態列,如果你有其他的需要可以自己新增進去。這個時候執行一下看看效果
![透明.png](https://i.iter01.com/images/ea033743ce9b357469ff3bc5464cc2c5b64b5b275fa92df8d4b111c667357711.png)
恩,真的透明瞭,那麼我們怎麼讓顏色延伸到狀態列呢?很容易想到的一種是根節點設定
android:fitsSystemWindows="true"
然後設定根節點的顏色和自己的自定義標題欄一致,上佈局程式碼:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1"
android:fitsSystemWindows="true"
android:background="#f13f00"
android:orientation="vertical"
tools:context=".lockscreen.view.MainActivity">
<!--標題佈局-->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.1"
android:background="#f13f00">
<TextView
android:id="@+id/main_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="ginbol"
android:textColor="@android:color/white"
android:textSize="20sp"
android:textStyle="bold" />
</RelativeLayout>
</LinearLayout>
複製程式碼
上圖:
![一片紅.png](https://i.iter01.com/images/9de40885e67c09d9705af6ded81c02c906e889b973f9c998c0a6fd1b2cfdb033.png)
狀態列顏色成功變色,只要我們在使用其他佈局的時候改變背景色就可以成功的實現沉浸式狀態列的效果了,但是,我在如此使用使用的時候曾經碰到一個bug,會導致部分佈局顏色發生變化。使用這種佈局實現的沉浸式所導致的bug,我沒能解決,所以我只好換一種實現方法了……而且,在4.4的解決方案中我也推薦這種方法……這種方法是在看stormzhang-薄荷Toolbar(ActionBar)適配解決方案中看到的,同樣適用於我這裡。
首先佈局和標題欄和剛剛差不多,但是根節點不用
android:fitsSystemWindows="true"
在自定義標題欄中加上
android:paddingTop="@dimen/topview_padding"
這個paddingTop在api19以上的版本是25dp,以下是0,在使用這個方法之後執行出來的結果也是對的,就不放圖了。至於這個值為什麼是25dp,stormzhang的解釋是在原始碼中看到了狀態列的高度就是那麼多。
最後的TIPS
有些手機可能在xml中設定狀態列透明並不起作用,使用程式碼在Activity中設定效果更佳。對於使用toolbar的專案,可以去看我上面提到的部落格,而且在他的部落格中也有提到在程式碼中設定透明狀態列以及BaseActivity的抽取。