實現(xiàn)透明狀態(tài)欄的方法


之前一直對透明狀態(tài)欄的設置有一些疑問,在經(jīng)過查找相關的資料后,對透明狀態(tài)欄的使用有了一定的理解。在這里寫下來,方便自己日后查看。
在這里給大家一個友情提示,如果你是用真機調(diào)試的,請先在設置—>通知和狀態(tài)欄中,將沉浸式狀態(tài)欄關閉(魅族),不然你會發(fā)現(xiàn)即使沒有使用下面這些方法,也實現(xiàn)了透明狀態(tài)欄的效果。這一點讓我納悶了半天…

在代碼中實現(xiàn)透明狀態(tài)欄

以前在看資料時,經(jīng)常會看到“沉浸式狀態(tài)欄”一詞,但是一直不知道什么什么樣的才能稱為沉浸式狀態(tài)欄,直到最近看了郭神的博客,感覺到豁然開朗,Android沉浸式模式的本質(zhì)就是全屏化,將屏幕控件都用來顯示內(nèi)容。所以沒有所謂的沉浸式狀態(tài)欄這種叫法,只能算是透明狀態(tài)欄吧。

類似于這種效果

透明狀態(tài)欄效果

(1)首先,通過代碼實現(xiàn)全屏顯示,實現(xiàn)下圖的效果。

全屏顯示效果

在Activity的onCreate方法中寫如下代碼

View decorview = getWindow().getDecorView();
//1.全屏狀態(tài)
int option = View.SYSTEM_UI_FLAG_FULLSCREEN;
decorview.setSystemUiVisibility(option);
ActionBar actionBar = getSupportActionBar();
actionBar.hide();//隱藏actionbar

這里通過getWindow().getDecorView()這個方法得到當前界面的DecorView,然后通過setSystemUiVisibility()來設置系統(tǒng)UI的可見性,View.SYSTEM_UI_FLAG_FULLSCREEN的意思是全屏顯示,就是將系統(tǒng)的狀態(tài)欄隱藏。根據(jù)Android的設計建議,ActionBar不應該獨立于狀態(tài)欄顯示,而且隱藏狀態(tài)欄,顯示ActionBar也很丑,所以這里需要將ActionBar隱藏。

(2)實現(xiàn)透明狀態(tài)欄的效果。

透明狀態(tài)欄效果

實現(xiàn)代碼

View decorview = getWindow().getDecorView();
if(Build.VERSION.SDK_INT>=21){//5.0以上的系統(tǒng)支持    
    int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN |View.SYSTEM_UI_FLAG_LAYOUT_STABLE;//表示讓應用主題內(nèi)容占據(jù)系統(tǒng)狀態(tài)欄的空間        
   decorview.setSystemUiVisibility(option); 
   getWindow().setStatusBarColor(Color.parseColor("#00ffffff"));//設置狀態(tài)欄顏色為透明    
   ActionBar actionBar  = getSupportActionBar();   
   actionBar.hide();
 }

通過View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN|View.SYSTEM_UI_FLAG_LAYOUT_STABLE設置頁面布局的全屏顯示,并顯示狀態(tài)欄,這兩個必須一起設置,表示讓頁面的主題內(nèi)容占用系統(tǒng)狀態(tài)欄的空間,再通過getWindow().setStatusBarColor(Color.parseColor("#00ffffff"))設置狀態(tài)欄的顏色,但是這個方法只有5.0及以上的系統(tǒng)才支持,所以需要做一個判斷。

(3)實現(xiàn)隱藏導航欄

隱藏導航欄

實現(xiàn)代碼

int option = View.SYSTEM_UI_FLAG_FULLSCREEN|View.SYSTEM_UI_FLAG_HIDE_NAVIGATION;
decorview.setSystemUiVisibility(option);
ActionBar actionBar = getSupportActionBar();
actionBar.hide();

我使用的是魅族手機,沒有導航欄,所以看不到效果,原來效果是和圖(1)相同的,但是點擊屏幕后,狀態(tài)就出來了,并且不會隱藏,也就是退出了全屏模式。

(4)透明導航欄和狀態(tài)欄

透明狀態(tài)欄和導航欄

實現(xiàn)代碼

if(Build.VERSION.SDK_INT>=21){
    int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN|
    View.SYSTEM_UI_FLAG_LAYOUT_STABLE|
    View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION;
    decorview.setSystemUiVisibility(option);
    getWindow().setStatusBarColor(Color.TRANSPARENT);          
    getWindow().setNavigationBarColor(Color.TRANSPARENT);
    ActionBar actionBar = getSupportActionBar();    
    actionBar.hide();
}

只有5.0及以上的系統(tǒng)才能通過這種方法設置。

(5)真正的沉浸式模式,使用整個屏幕顯示內(nèi)容

沉浸式模式

實現(xiàn)代碼

@Override
public void onWindowFocusChanged(boolean hasFocus) {  
super.onWindowFocusChanged(hasFocus);    
if (hasFocus && Build.VERSION.SDK_INT >= 19) {       
     View decorView = getWindow().getDecorView();
    decorView.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE |
            View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION |
            View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN |
            View.SYSTEM_UI_FLAG_HIDE_NAVIGATION |
            View.SYSTEM_UI_FLAG_FULLSCREEN |
            View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);    
    }
}

重寫Activity的onWindowFocusChanged方法實現(xiàn)沉浸模式,只有4.4及以上系統(tǒng)支持沉浸式模式。

設置主題實現(xiàn)透明狀態(tài)欄。

Android從4.4開始引入了Translucent System Bar特性,即半透明狀態(tài)欄,透過這個特性可以比較容易的在4.4及以上系統(tǒng)中實現(xiàn)透明狀態(tài)欄效果。由于4.4和5.0設置方式不同,所以需要在res目錄下,建立values,values-v19,values-v21三個目錄,每個目錄中建立styles.xml樣式文件。這樣不同的系統(tǒng)就會自動用相應的樣式了。

目錄結(jié)構(gòu)

透明狀態(tài)欄有兩種不同的場景,一種是圖片背景,一種是純色背景。

QQ音樂純色背景

首先來說一下圖片當做背景的使用場景,在三個目錄中的styles.xml中分別定義ImageTranslucentBarTheme主題。

values目錄中,針對4.4以前的系統(tǒng)

<style name="ImageTranslucentBarTheme" parent="AppTheme">   
 <!--4.4之前的狀態(tài)欄跟隨系統(tǒng)-->
</style>

values-v19,針對4.4以后的系統(tǒng)

<style name="ImageTranslucentBarTheme"     parent="Theme.AppCompat.Light.DarkActionBar"> 
    <!--半透明狀態(tài)欄-->    
    <item name="android:windowTranslucentStatus">true</item>
    <!--半透明導航欄-->  
    <item name="android:windowTranslucentNavigation">true</item>
</style>

values-v21,針對5.0以后的系統(tǒng),需要注意的是,在5.0以后的系統(tǒng)中,需要手動設置狀態(tài)欄的顏色,若沒有設置,則狀態(tài)欄是半透明的白色。

<style name="ImageTranslucentBarTheme" parent="Theme.AppCompat.Light.DarkActionBar">    
    <!--半透明狀態(tài)欄-->    
    <item name="android:windowTranslucentStatus">true</item>
    <!--半透明導航欄-->
    <item name="android:windowTranslucentNavigation">true</item>
    <!--5.0以后要手動設置狀態(tài)欄的顏色-->
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

在layout中,需要在根視圖中設置下面這個屬性。

 android:fitsSystemWindows="true"  

在Activity中需要隱藏標題欄,因為我的Activity是繼承的AppcompatActivity的,所以要這樣寫

supportRequestWindowFeature(Window.FEATURE_NO_TITLE);

ImageTranslucentBarTheme主題效果

另一種是純色背景,在三個目錄中的styles.xml中分別定義ColorTranslucentBarTheme主題。
values目錄中,針對4.4以前的系統(tǒng)

<style name="ColorTranslucentBarTheme" parent="AppTheme">
    <!--4.4之前的狀態(tài)欄跟隨系統(tǒng)-->
</style>

values-v19,針對4.4以后的系統(tǒng)

<style name="ColorTranslucentBarTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
</style>

values-v21,針對5.0以后的系統(tǒng),需要注意的是,在5.0以后的系統(tǒng)中,需要手動設置狀態(tài)欄的顏色,并且需要把layout中標題欄視圖的背景顏色設置的和狀態(tài)欄一樣,和上一個方法一樣,在根視圖中加入*android:fitsSystemWindows="true"
*屬性

<style name="ColorTranslucentBarTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:windowTranslucentStatus">false</item>
    <item name="android:windowTranslucentNavigation">true</item>
    <item name="android:statusBarColor">#31c27c</item>
</style>

布局文件

<?xml version="1.0" encoding="utf-8"?>
<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:orientation="vertical"
   android:fitsSystemWindows="true"
   tools:context="com.wang.administrator.statubar.ColorTranslucentActivity">
      <RelativeLayout
          android:layout_width="match_parent"
          android:layout_height="55dp"
          android:background="#31c27c">
              <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="QQ Music"
                    android:textColor="@android:color/white"
                    android:layout_centerInParent="true"
                    android:textSize="20sp"/>
      </RelativeLayout>
      <Button
            android:id="@+id/show"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="20dp"
            android:text="Show A Toast"/>
 </LinearLayout>
ColorTranslucentBarTheme主題效果

第一次寫筆記,有說的不對的地方歡迎指出。
參考連接
Translucent System Bar 的最佳實踐
Android沉浸式狀態(tài)欄完全解析

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容