Android App 沉浸式状态栏解决方案/透明栏Translucent Bars

最新推荐文章于 2024-05-11 03:57:58 发布

骑鲸鱼的企鹅

最新推荐文章于 2024-05-11 03:57:58 发布

阅读量803

点赞数

分类专栏：小Demo 整理文章标签：解决方案

整理同时被 2 个专栏收录

21 篇文章 0 订阅

订阅专栏

小Demo

12 篇文章 0 订阅

订阅专栏

http://www.open-open.com/lib/view/open1455584716230.html#articleHeader2

解决方案
1. 给状态栏设置颜色
思路是：

先设置状态栏透明属性；
给根布局加上一个和状态栏一样大小的矩形View（色块），添加到顶上；
然后设置根布局的 FitsSystemWindows 属性为 true,此时根布局会延伸到状态栏，处在状态栏位置的就是之前添加的色块，这样就给状态栏设置上颜色了。
代码如下：

    /** * 设置状态栏颜色 * * @param activity 需要设置的activity * @param color 状态栏颜色值 */
    public static void setColor(Activity activity, int color) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            // 设置状态栏透明
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            // 生成一个状态栏大小的矩形
            View statusView = createStatusView(activity, color);
            // 添加 statusView 到布局中
            ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
            decorView.addView(statusView);
            // 设置根布局的参数
            ViewGroup rootView = (ViewGroup) ((ViewGroup) activity.findViewById(android.R.id.content)).getChildAt(0);
            rootView.setFitsSystemWindows(true);
            rootView.setClipToPadding(true);
        }
    }

其中生成状态栏一样大小的矩形色块的代码如下：

   /** * 生成一个和状态栏大小相同的矩形条 * * @param activity 需要设置的activity * @param color 状态栏颜色值 * @return 状态栏矩形条 */
    private static View createStatusView(Activity activity, int color) {
        // 获得状态栏高度
        int resourceId = activity.getResources().getIdentifier("status_bar_height", "dimen", "android");
        int statusBarHeight = activity.getResources().getDimensionPixelSize(resourceId);

        // 绘制一个和状态栏一样高的矩形
        View statusView = new View(activity);
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                statusBarHeight);
        statusView.setLayoutParams(params);
        statusView.setBackgroundColor(color);
        return statusView;
    }

在 setContentView() 之后调用 setColor(Activity activity, int color) 方法即可。

图片作背景时，状态栏透明
这个实现比较简单，根布局背景设置为图片，然后添加状态栏透明 Flag，然后设置根布局的 FitsSystemWindows 属性为 true 即可。代码如下：

/** * 使状态栏透明 * <p> * 适用于图片作为背景的界面,此时需要图片填充到状态栏 * * @param activity 需要设置的activity */
    public static void setTranslucent(Activity activity) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            // 设置状态栏透明
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            // 设置根布局的参数
            ViewGroup rootView = (ViewGroup) ((ViewGroup) activity.findViewById(android.R.id.content)).getChildAt(0);
            rootView.setFitsSystemWindows(true);
            rootView.setClipToPadding(true);
        }
    }

同样的，在 setContentView() 之后调用 setTranslucent(Activity activity) 方法即可。

使用 DrawerLayout 时的特殊处理
注意点：

使用 DrawerLayout 时，此时不能再对根布局，即 DrawerLayout 进行设置，而要针对 DrawerLayout 的内容布局进行设置，即抽屉之外的另一个布局。

如下是一个典型的 DrawerLayout 的布局，其内容布局即 FrameLayout,我们需要对 FrameLayout 进行仿状态栏色块的添加、FitsSystemWindows 属性的设置。

<?xml version="1.0" encoding="utf-8"?>

<android.support.v4.widget.DrawerLayout
    android:id="@+id/drawer_layout"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:id="@+id/main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/colorPrimary"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
        </LinearLayout>
    </FrameLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:headerLayout="@layout/nav_header"
        app:menu="@menu/activity_main_drawer"/>

</android.support.v4.widget.DrawerLayout>

还有一个需要注意的设置抽屉布局（Drawer）的 FitsSystemWindows 属性为 false，即上面布局中的 NavigationView。
解决方案

DrawerLayout 状态栏变色

代码如下：

/** * 为DrawerLayout 布局设置状态栏变色 * * @param activity 需要设置的activity * @param drawerLayout DrawerLayout * @param color 状态栏颜色值 */
    public static void setColorForDrawerLayout(Activity activity, DrawerLayout drawerLayout, int color) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            // 生成一个状态栏大小的矩形
            View statusBarView = createStatusBarView(activity, color);
            // 添加 statusBarView 到布局中
            ViewGroup contentLayout = (ViewGroup) drawerLayout.getChildAt(0);
            contentLayout.addView(statusBarView, 0);
            // 内容布局不是 LinearLayout 时,设置padding top
            if (!(contentLayout instanceof LinearLayout) && contentLayout.getChildAt(1) != null) {
                contentLayout.getChildAt(1).setPadding(0, getStatusBarHeight(activity), 0, 0);
            }
            // 设置属性
            ViewGroup drawer = (ViewGroup) drawerLayout.getChildAt(1);
            drawerLayout.setFitsSystemWindows(false);
            contentLayout.setFitsSystemWindows(false);
            contentLayout.setClipToPadding(true);
            drawer.setFitsSystemWindows(false);
        }
    }

需要注意的是，DrawerLayout 的布局只能包含两个直接子布局，一个是内容布局，一个是抽屉布局，结构如前面的示例布局所示，如果内容布局的根布局如果不是 LinearLayout 需要对其子布局设置padding top值，否则仿状态栏色块会被遮挡在最下面，布局内容延伸到状态栏，如下图所示：
这里写图片描述

（ps：就上图中的问题，目前的解决方案感觉并不是很好，如果你有更好的解决方案，请告诉我~）

DrawerLayout 状态栏透明

/** * 为 DrawerLayout 布局设置状态栏透明 * * @param activity 需要设置的activity * @param drawerLayout DrawerLayout */
    public static void setTranslucentForDrawerLayout(Activity activity, DrawerLayout drawerLayout) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            // 设置状态栏透明
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            // 设置内容布局属性
            ViewGroup contentLayout = (ViewGroup) drawerLayout.getChildAt(0);
            contentLayout.setFitsSystemWindows(true);
            contentLayout.setClipToPadding(true);
            // 设置抽屉布局属性
            ViewGroup vg = (ViewGroup) drawerLayout.getChildAt(1);
            vg.setFitsSystemWindows(false);
            // 设置 DrawerLayout 属性
            drawerLayout.setFitsSystemWindows(false);
        }
    }

同样的，在 setContentView() 之后调用上述解决方案中的方法即可。

在项目中使用

以上代码我整理成了一个工具类，放在 github 上：StatusBarUtils.java 文件

在项目中推荐这样使用，在 BaseActivity 中重写 setContentView(int layoutResID) 方法，新建一个 setStatusBarColor()方法，全局设置状态栏颜色，因为一般 App 大部分界面状态栏都是主题色。

public class BaseActivity extends AppCompatActivity {

    @Override
    public void setContentView(int layoutResID) {
        super.setContentView(layoutResID);
        setStatusBarColor();
    }

    protected void setStatusBar() {
        StatusBarUtils.setColor(this, getResources().getColor(R.color.colorPrimary));
    }

}

当子类 Activity 的状态栏需要特殊处理时，比如设置不同的颜色，或者设置图片为背景时，重写父类的 setStatusBarColor() 方法即可，例如：

public class ImageStatusBarActivity extends BaseActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_status_bar);

    }

    @Override
    protected void setStatusBar() {
        StatusBarUtils.setTranslucent(this);
    }

对 DrawerLayout 布局使用时，需要注意一点，因为方法是在 setContentView() 之后立即调用的，所以传进来的 DrawerLayout 要通过 findViewById() 传进来。如果传入在 setContentView() 之后通过 findViewById() 得到的 DrawerLayout，则会造成空指针异常。

StatusBarUtils.setColorForDrawerLayout(this, (DrawerLayout) findViewById(R.id.drawer_layout), getResources()
                .getColor(R.color.colorPrimary));

原文：
http://www.open-open.com/lib/view/open1455584716230.html#articleHeader2

骑鲸鱼的企鹅

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Android App 沉浸式状态栏解决方案/透明栏Translucent Bars

http://www.open-open.com/lib/view/open1455584716230.html#articleHeader2解决方案 1. 给状态栏设置颜色思路是：先设置状态栏透明属性；给根布局加上一个和状态栏一样大小的矩形View（色块），添加到顶上；然后设置根布局的 FitsSystemWindows 属性为 true,此时根布局会延伸到状态栏，处在状态栏位置的就
复制链接

扫一扫

专栏目录