android透明狀態(tài)欄——你要的只是幾個方法

以前寫的項目基本沒有考慮過Android透明狀態(tài)欄的，最近項目有用到，便網(wǎng)上搜索一番。搜到的文章要么是講解不全、存在錯誤，要么就是使用一些庫，也不說原理，上來就是給你看效果圖，然后十幾個方法讓你眼花繚亂，看源碼就是越看越復(fù)雜。算了，自己寫個簡單能用的就好。所以，本文將通俗易懂地介紹Android透明狀態(tài)欄原理，以及幾種常見使用場景的處理方法。

下面是實現(xiàn)的效果：


透明狀態(tài)欄.gif

以上效果支持狀態(tài)欄和標(biāo)題欄（ToolBar或者自定義）背景一致且可修改（改變顏色、漸變色、不透明度看你自己怎么改），標(biāo)題欄位置不被狀態(tài)欄遮擋，6.0之上淺色狀態(tài)欄背景修改字體顏色為深色。支持DrawerLayout使用、Fragment使用。雖然效果很多，其實原理都是一樣的。

本文會教你如何修改狀態(tài)欄的顏色、如何解決狀態(tài)欄和標(biāo)題欄內(nèi)容重合的問題。

順便說下，這里的透明狀態(tài)欄指的是布局內(nèi)容延伸到狀態(tài)欄的效果，網(wǎng)上很多人也叫做沉浸式狀態(tài)欄，這里不做辯駁。

原理

透明狀態(tài)欄的設(shè)置存在兼容性。Android 4.4（API 19）之前不支持透明狀態(tài)欄，而Android 5.0（API 21）之后版本對于透明狀態(tài)欄則有不同的處理方式。所以，我們要兼容的就是保證4.4之前的版本雖然不支持透明狀態(tài)欄，但是UI效果還是要協(xié)調(diào)，而4.4之后的版本跟根據(jù)不同的API版本盡量達(dá)成一致的顯示效果。

設(shè)置透明狀態(tài)欄，最核心的方法就是下面這一個方法：

 public static void makeStatusBarTransparent(Activity activity) {
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
            return;
        }
        Window window = activity.getWindow();
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            int option = window.getDecorView().getSystemUiVisibility() | View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
            window.getDecorView().setSystemUiVisibility(option);
            window.setStatusBarColor(Color.TRANSPARENT);
        } else {
            window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
        }
    }

你應(yīng)該在網(wǎng)上找到了很多版本，類似的代碼。歸根到底，就這一個方法對Activity進行設(shè)置即可實現(xiàn)透明狀態(tài)欄。這個方法調(diào)用后，頁面布局內(nèi)容就會延伸至狀態(tài)欄，狀態(tài)欄即為透明色。


image.png

但是，這里要注意下，其帶來了一個問題是頁面布局會延伸至狀態(tài)欄，你布局中的標(biāo)題欄和狀態(tài)欄重合了，這顯示不是我們想要的效果。我們想要的是原有標(biāo)題欄還是在原來標(biāo)題欄的位置，只不過狀態(tài)欄的顏色和標(biāo)題欄一致。接下來，我們將要解決的就是標(biāo)題欄和狀態(tài)欄重合的問題。這個問題，也是你看到的所有第三方庫想要幫你解決的問題。第三方庫為了滿足廣大開發(fā)者的需求，也是為了適配各種情況，通常會增加N多種接口或者方式來處理這個問題，但隨之而來帶來的就是復(fù)雜性，不易理解。接口方法太多了，通常都要組合搭配調(diào)用才能生效，不看源碼，光看接口估計會很懵逼。

好勒，接下來，我們就介紹幾種方式來解決標(biāo)題欄和狀態(tài)欄重合問題。

標(biāo)題欄和狀態(tài)欄重合問題

解決狀態(tài)欄和標(biāo)題欄重疊的幾種方法原理都是一致的：讓布局中的標(biāo)題欄有一個狀態(tài)欄高度的marginTop或者paddingTop即可。但因為4.4之前是不存在狀態(tài)欄重合這種問題，所以也就不需要有一個狀態(tài)欄高度的marginTop或者paddingTop，所以要考慮一個兼容性問題。

幾種解決辦法：

  • 使用系統(tǒng)提供的fitSystemWindows屬性
  • 給標(biāo)題控件動態(tài)增加paddingTop
  • 在DecorView中動態(tài)創(chuàng)建一個狀態(tài)欄高度的View，然后更改View背景為想要的顏色，然后設(shè)置標(biāo)題欄marginTop為狀態(tài)欄高度
  • 在布局中定義一個假的用來充當(dāng)狀態(tài)欄的View，動態(tài)設(shè)置其高度或者可見性

不同方式都有各自的優(yōu)劣，建議根據(jù)不同的場景來靈活應(yīng)用。

方式一：系統(tǒng)提供的fitSystemWindows屬性

fitsSystemWindows屬性：

  • 在透明狀態(tài)欄或者全屏?xí)r候生效。（4.4之前添加了這個屬性也沒有任何效果的，滿足兼容性）
  • 如果將某個View的該屬性設(shè)置為true，則系統(tǒng)會為該View添加一個paddingTop，值為狀態(tài)欄的高度。
  • 如果多個View同時設(shè)置該屬性為true，則只有第一個會起作用。此為一般情況。
  • 默認(rèn)系統(tǒng)只處理第一個fitsSystemWindows，但每個控件自己可以單獨處理fitsSystemWindows。

fitsSystemWindows屬性為true的時候，在透明狀態(tài)欄模式下，4.4（含）之后的版本控件，系統(tǒng)會針對掃描到的該屬性設(shè)置為true的第一個控件設(shè)置一個狀態(tài)欄高度的paddingTop（原有View的paddingTop將會失效）。

注意：上面這段話是我的個人理解，并不嚴(yán)謹(jǐn)。

知道上面的原理后，我們可以根據(jù)需要來為哪個控件設(shè)置fitsSystemWindows屬性為true。

因為是設(shè)定paddingTop，如果你的標(biāo)題欄是一個固定高度比如50dp，那么設(shè)置后是不會有效的，畢竟高度寫死了的。所以呢通常設(shè)置這個屬性的View高度是一個wrap_content，如果不是的話呢，那么你就在外面包一個FrameLayout或者LinearLayout，然后將原來View的背景設(shè)置到外面的包裝Layout上。

比如下面的在原來標(biāo)題欄RelativeLayout布局外面包裝一個LinearLayout，然后給LinearLayout添加一個fitsSystemWindows屬性，并且修改LinearLayout的背景為標(biāo)題欄背景色。


image.png

對了，我試過fitsSystemWindows如果在Fragment中使用貌似是不生效的。

方式二：給標(biāo)題欄控件動態(tài)增加paddingTop

4.4之前的話就不加了?？梢杂么a來動態(tài)增加，或者適用的話也可以放到values文件中。代碼獲取狀態(tài)欄高度：

 public static int getStatusBarHeight() {
        Resources resources = Resources.getSystem();
        int resourceId = resources.getIdentifier("status_bar_height", "dimen", "android");
        return resources.getDimensionPixelSize(resourceId);
    }

給標(biāo)題欄控件動態(tài)增加高度的方法：

public static void fitTitleBar(Activity activity, final View titleBar) {
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
            return;
        }
        makeStatusBarTransparent(activity);
        final ViewGroup.LayoutParams layoutParams = titleBar.getLayoutParams();
        assert layoutParams != null;
        if (layoutParams.height == ViewGroup.LayoutParams.WRAP_CONTENT ||
                layoutParams.height == ViewGroup.LayoutParams.MATCH_PARENT) {
            titleBar.post(new Runnable() {
                @Override
                public void run() {
                    layoutParams.height = titleBar.getHeight() + getStatusBarHeight();
                    titleBar.setPadding(titleBar.getPaddingLeft(),
                            titleBar.getPaddingTop() + getStatusBarHeight(),
                            titleBar.getPaddingRight(),
                            titleBar.getPaddingBottom());
                }
            });
        } else {
            layoutParams.height += getStatusBarHeight();
            titleBar.setPadding(titleBar.getPaddingLeft(),
                    titleBar.getPaddingTop() + getStatusBarHeight(),
                    titleBar.getPaddingRight(),
                    titleBar.getPaddingBottom());
        }
    }

如果不是固定高度的控件，那么直接增加一個狀態(tài)欄高度的paddingTop，如果是寫死高度的控件，則需要同時給高度增加一個狀態(tài)欄高度。

在應(yīng)用此方法的時候要注意，這個titleBar控件增加了paddingTop或者高度后，其內(nèi)部布局要非常協(xié)調(diào)，不要影響到美觀了。如果你的標(biāo)題欄用RelativeLayout寫的，然后里面文本居中那么使用此方法后顯示效果會很丑陋，可以參考第一種方式在外面包裝一層。

除了代碼控制，還可以根據(jù)API版本不同配置不同像素高度的status_bar_offset，然后設(shè)置到布局中。通常，狀態(tài)欄高度是24或者25dp。在4.4（API 19）之前不需要處理重疊問題所以設(shè)置status_bar_offset為0dp，在values-v19中設(shè)置status_bar_offset為25dp，然后根據(jù)布局的不同動態(tài)增加padding。

比如：
values/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="status_bar_offset">0dp</dimen>
</resources>

values-v19/dimens.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="status_bar_offset">25dp</dimen>
</resources>

布局文件

<LinearLayout android:id="@+id/top_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/holo_green_dark"
        android:paddingTop="@dimen/status_bar_offset"
        android:orientation="vertical">
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="50dp">
            <TextView android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Hello"
                android:textColor="@color/white"
                android:layout_centerInParent="true"/>
        </RelativeLayout>
    </LinearLayout>

除了上面這種寫法，還有很多種寫法，發(fā)揮你的想象力！

根據(jù)版本不同處理不同的padding這種，個人還是比較推崇的，不用寫太多代碼，直接布局就寫好了。當(dāng)然可能是針對一些比較簡單的頁面處理哈。

方式三：動態(tài)創(chuàng)建狀態(tài)欄高度的View添加到DecorView中，然后設(shè)置標(biāo)題欄的marginTop為狀態(tài)欄高度

很多第三方庫都喜歡這種方式。個人不喜歡用，個人鐘愛第二種和第一種哈哈。
這種方式也有局限性，比如對于DrawerLayout的情況，如果采用這種方式將statusBar添加到DecorView上，會導(dǎo)致側(cè)邊欄也會被狀態(tài)欄所覆蓋。

public static View setStatusBarColor(Activity activity, int color) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
          return null;
    }
    makeStatusBarTransparent(activity);
    return applyStatusBarColor(activity, color);
}

private static View applyStatusBarColor(Activity activity, int color) {
    View fakeStatusBar = ensureStatusBar(activity);
    fakeStatusBar.setBackgroundColor(color);
    return fakeStatusBar;
}

private static View ensureStatusBar(Activity activity) {
    ViewGroup parent = (ViewGroup) activity.getWindow().getDecorView();
    View fakeStatusBar = parent.findViewWithTag(TAG_FAKE_STATUS_BAR);
    if (fakeStatusBar == null) {
        fakeStatusBar = createStatusBar(activity);
        fakeStatusBar.setTag(TAG_FAKE_STATUS_BAR);
        parent.addView(fakeStatusBar);
    }
    return fakeStatusBar;
}

private static View createStatusBar(Activity activity) {
    View statusBarView = new View(activity);
    ViewGroup.LayoutParams layoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, getStatusBarHeight());
    statusBarView.setLayoutParams(layoutParams);
    return statusBarView;
}

public static void addMarginTopEqualStatusBarHeight(View view) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) {
          return;
    }
    view.setTag(TAG_OFFSET);
    Object haveSetOffset = view.getTag(KEY_OFFSET);
    if (haveSetOffset instanceof Boolean) {
        return;
    }
    ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) view.getLayoutParams();
    layoutParams.setMargins(layoutParams.leftMargin,
              layoutParams.topMargin + getStatusBarHeight(),
              layoutParams.rightMargin,
              layoutParams.bottomMargin);
    view.setTag(KEY_OFFSET, true);
}


  public static void subtractMarginTopEqualStatusBarHeight(View view) {
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.KITKAT) return;
        Object haveSetOffset = view.getTag(KEY_OFFSET);
        if (haveSetOffset == null || !(Boolean) haveSetOffset) {
            return;
        }
        ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) view.getLayoutParams();
        layoutParams.setMargins(layoutParams.leftMargin,
                layoutParams.topMargin - getStatusBarHeight(),
                layoutParams.rightMargin,
                layoutParams.bottomMargin);
        view.setTag(KEY_OFFSET, false);
    }

方式四 在布局中定義假的充當(dāng)狀態(tài)欄的View，然后動態(tài)設(shè)置其高度。

這種方式是為了解決方式三不適用于DrawerLayout的情況，因為DecorView中添加的View是蓋在整個布局上的，所以會遮擋側(cè)邊欄。那么將其移動到布局中自己可控就好勒。

具體代碼不提供了，有思路就好。

狀態(tài)欄背景顏色為淺色導(dǎo)致狀態(tài)字體看不清的問題解決

狀態(tài)欄顏色默認(rèn)為白色，如果你的狀態(tài)欄背景為淺色，那么會導(dǎo)致字體看不清楚。Android 6.0之后提供了方法設(shè)置為深色字體。

下面設(shè)置為light模式，則是讓狀態(tài)欄字體顏色變深，反之變淺。

 public static void setStatusBarLightMode(Activity activity, boolean isLightMode) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
            Window window = activity.getWindow();
            int option = window.getDecorView().getSystemUiVisibility();
            if (isLightMode) {
                option |= View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR;
            } else {
                option &= ~View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR;
            }
            window.getDecorView().setSystemUiVisibility(option);
        }
    }

綜述

綜上，提供參考代碼地址：https://github.com/luckyshane/TintBar。

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

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

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