Android透明状态栏总结

去年曾对状态栏进行了一次总结,具体见安卓自定义StatusBar-布局内容延展及沉浸式状态栏实现。近期再一次做透明状态栏相关的工作,加深了对状态栏的理解。所以决定再做一次总结,争取能做到通熟易懂。

先提几个关键词。Transparent(透明的)、Translucent(半透明)、Immersive(沉浸式)

首先聊下沉浸式这个词,它指给用户提供完全沉浸的体验。沉浸式状态栏的叫法是错误的,应该是一种沉浸式的模式。它要求隐藏状态栏,使屏幕全屏,常应用在游戏,视频播放场景。具体可参考郭霖的博客Android状态栏微技巧,带你真正理解沉浸式模式.

关于状态栏,比较常见的效果如下:


图1

图2

设置状态栏颜色

图1和图2的状态栏颜色不同。实现的思路如下:
1、android 5.0及以上版本

window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(int);

其中,5.0版本的FLAG_TRANSLUCENT_STATUS是全透明的,但是6.0上却是半透明的。若要实现图1的效果,则需要直接设置statusbar的颜色。
2、android 4.4版本
通过设置状态栏为透明,将应用布局延展到状态栏下面。然后在布局里构造一个同状态栏同尺寸的view,对view设置背景颜色即可。

//设置透明状态栏
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
//取消透明状态栏
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

注意,4.4版本的透明效果如下图,顶部有一个黑色的半透明过渡。


image.png

实现代码如下:

/**
     * 设置状态栏颜色
     *
     * @param activity       需要设置的activity
     * @param color          状态栏颜色值
     * @param statusBarAlpha 状态栏透明度
     */

    public static void setColor(Activity activity, @ColorInt int color, @IntRange(from = 0, to = 255) int statusBarAlpha) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            //
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            //取消透明状态栏,contentView不再与状态栏重叠
            activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            activity.getWindow().setStatusBarColor(calculateStatusColor(color, statusBarAlpha));
        } else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            //透明状态栏,contentView与状态栏重叠,需使用fitSystemWindow属性
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
            View fakeStatusBarView = decorView.findViewById(FAKE_STATUS_BAR_VIEW_ID);
            if (fakeStatusBarView != null) {
                if (fakeStatusBarView.getVisibility() == View.GONE) {
                    fakeStatusBarView.setVisibility(View.VISIBLE);
                }
                fakeStatusBarView.setBackgroundColor(calculateStatusColor(color, statusBarAlpha));
            } else {
                decorView.addView(createStatusBarView(activity, color, statusBarAlpha));
            }
            setRootView(activity);
        }
    }

/**
     * 生成一个和状态栏大小相同的半透明矩形条
     *
     * @param activity 需要设置的activity
     * @param color    状态栏颜色值
     * @param alpha    透明值
     * @return 状态栏矩形条
     */
    private static View createStatusBarView(Activity activity, @ColorInt int color, int alpha) {
        // 绘制一个和状态栏一样高的矩形
        View statusBarView = new View(activity);
        LinearLayout.LayoutParams params =
            new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, getStatusBarHeight(activity));
        statusBarView.setLayoutParams(params);
        statusBarView.setBackgroundColor(calculateStatusColor(color, alpha));
        statusBarView.setId(FAKE_STATUS_BAR_VIEW_ID);
        return statusBarView;
    }

布局延展至状态栏

1、android 5.0及以上版本
使用setSystemUiVisibility方法,设置View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN和View.SYSTEM_UI_FLAG_LAYOUT_STABLE。

//代码配置
activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
activity.getWindow().setStatusBarColor(Color.TRANSPARENT);
activity.getWindow().getDecorView().setSystemUiVisibility(
        View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                | SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION

);

//xml配置:values-v21/styles.xml中主题增加以下内容
<style name="fullScreenTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:windowTranslucentStatus">false</item>
    <item name="android:windowTranslucentNavigation">true</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
</style>

避免使用WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS属性,以提高体验,解决6.0系统的兼容性问题


6.0系统半透明状态栏

2、android 4.4版本

window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

上述的两个步骤,针对下图中图片延展到状态栏,能完全满足需求。


图片延展

但针对一些布局延展,则需要额外处理来解决布局内容和状态栏区域覆盖的问题。一般的做法是使用fitSystemWindow属性

fitSystemWindow

可以通过java代码或xml来配置。
1、view的fitsSystemWindows设置为true后,系统会调整view的padding来给statusbar留出空间,padding的值与statusbar的高度相同。如果该view设置了背景色,则状态栏显示与view一致的背景色。若view未设置背景色,则会显示activity默认的背景色(theme中指定);如果activity移除了默认背景色,则状态栏会显示黑色。
2、如果是activity中包含fragment,则需要在fragment的内容中设置fitsSystemWindows属性。
3、建议在xml中进行灵活配置。如果通过theme或代码直接设置第一个子view的fitSystemWindows属性,容易出现问题。
4、多个view设置该属性时,一般只有第一个view生效。

默认背景色

可通过在style中设置windowBackground属性或java代码设置activity的默认背景色。系统提供的theme中,通过windowBackground设置了默认背景色。

//xml中设置
<item name="android:windowBackground">@color/white</item>

//java代码设置
getWindow().setBackgroundDrawable(drawable)

一般情况下,不推荐对activity设置默认背景。因activity的布局中一般有自己的背景色,添加window的背景色容易造成overdraw降低性能。一般使用getWindow().setBackgroundDrawable(null)或者xml中设置android:windowbackground="null" 删除window的背景色。但有以下注意事项。
1.这句代码必须要在setContentView()方法之后调用。
否则在页面未布局前,会出现一闪而过的黑影,影响用户体验。

2.若activity的父布局未设置背景,会出现没有子view的空白部分出现黑色。甚至在webview的使用时,出现滑动显示绘制异常的问题。建议给布局设置一个背景。

状态栏默认颜色

通过在theme中设置colorPrimaryDark。注意,在android 5.0之后才能进行该属性设置

<item name="colorPrimaryDark">@android:color/black</item>

下图可参考几个关键color属性的影响位置。


image.png

参考文档:
Android透明状态栏与沉浸模式全解
android 5.0系统新加的默认颜色 colorPrimary,colorPrimaryDark的作用
由沉浸式状态栏引发的血案
关于如何实现Android透明状态栏的总结
Android沉浸式状态栏(透明状态栏)最佳实现

推荐阅读更多精彩内容