状态栏

沉浸式状态栏全面解析

2019-12-28  本文已影响0人  肖邦kaka

前言

其实网上关于沉浸式状态栏的文章有很多,但是我发现基本上都有一个特点,就是先巴拉巴拉地讲一大堆概念,然后接着推出一个自己写的轮子。不是说这类文章不好,而是这类的文章往往读完了让人抓不住重点,只想着最后那个轮子,而我本人是非常不推荐使用别人写好的轮子,首先这类轮子面对很多不同场景的情况不能百分之百满足使用需求,其次过度地使用轮子往往会让开发者不了解代码到底是怎么实现沉浸式的。基于以上情况,就有了这篇文章。

准备知识

实现沉浸式状态栏主要跟以下四个Api相关:

View#setSystemUiVisibility()及其各种Flags

首先setSystemUiVisibility()这个方法就是设置状态栏或者导航栏的各种属性的,哪都有些可以设置的属性呢?

Window.addFlags()及其各种Flags

WindowManager.LayoutParams相关属性:

View#setFitsSystemWindows

此方法只有当设置SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN或者SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION才有有效,当窗口发生变化时,View需要调整自身内容以适应窗口的变化,你可以理解为当和SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN一起联用的时候,是给View加了个bottomTop属性,宽度填充视图,高度就是状态栏的高度;当和SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION一起联用的时候,是给View加了个bottomBottom属性,宽度填充视图,高度就是导航栏的高度,建议给布局的顶层ViewGroup使用

Window#setStatusBarColor()

Android5.0系统及以上开始支持,设置状态栏的颜色,为了使这个状态有效必须要设置FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS而且不能设置FLAG_TRANSLUCENT_STATUS

小结

上面的4个Api方法和其中的一些Flags非常重要,是实现沉浸式状态栏的关键,我都介绍得比较详细,只要你认真读下来,相信你已经对怎么实现沉浸式状态有了一定的思路了。

实现沉浸式状态栏的具体套路

实现沉浸式状态栏分为三个阶段,

Android4.4~Android5.0阶段以下:

Android真正可以实现沉浸式状态栏是从4.4开始的,因为4.4系统加入了一个重要的属性Window.LayoutParams.FLAG_TRANSLUCENT_STATUS,这个属性能干嘛,前面已经说过了,下面直接开搞。
首先,沉浸式状态栏一般有两种情况,一种是背景是一张图片,一种是颜色跟标题栏一致的

activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

这里简单解释一下,FLAG_TRANSLUCENT_STATUS这个属性会让状态栏以白色绘制,同时还会执行SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN和SYSTEM_UI_FLAG_LAYOUT_STABLE这样就会让状态栏浮在图片的上面,这样就形成了沉浸式的效果,怎么样,是不是很简单?看一下效果


背景是一张图片的情况.jpg
            View statusView = new View(activity);
            ViewGroup.LayoutParams statusViewLayoutParams = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, getStatusBarHeight(activity));
            ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
            decorView.addView(statusView, statusViewLayoutParams);
            ViewGroup rootView = decorView.findViewById(Window.ID_ANDROID_CONTENT);
            if (rootView != null) {
                rootView.setFitsSystemWindows(true);
            }
            activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);

看一下效果


颜色跟标题栏颜色一致.jpg

注意:从两张效果图的图片可以看出,沉浸式状态在这一阶段的表现还不是太好,上面会有一层黑色的半透明浮层,但是也基本可以实现了沉浸式。

Android5.0~Android6.0以下

这一阶段Android系统为我们增加了一个非常重要的API,Window#setStatusBarColor(),关于它的用法前面已经有所介绍,这里不再赘述,以及一个配合这个api使用的属性FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS,直接开搞

activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            activity.getWindow().setStatusBarColor(Color.TRANSPARENT);
            activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            activity.getWindow()
                    .getDecorView()
                    .setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);

这里简单解释一下,我们把状态栏的颜色设置成透明,同时让状态栏浮在视图上面且保持稳定,这样图片就会顶到视图的顶部,因此就实现了沉浸式的效果,代码很简单,万一看不懂就翻翻上面对各种api的介绍,最后再来看一眼效果图


5.0~6.0 背景是一张图片.jpg
 activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            activity.getWindow().setStatusBarColor(color);

方式二:给状态栏设置透明色并让状态栏浮在视图顶层,配合setFitsSystemWindows()

 activity.getWindow().getDecorView().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().setStatusBarColor(Color.TRANSPARENT);

toolBar.setFitsSystemWindows(true);//这里根据自己的布局情况

方式一和方式二都可以实现沉浸式状态栏,大家可以根据自己的业务情况去选择,这里我举个简单的例子,比如,我当前在进入页面的时候会加载一张骨架图,如果我采用方式一的沉浸式状态栏就有下面的问题,上图


骨架图的情况.jpg

这种情况的话,骨架图没有顶到视图的顶层,在加载过程中就会显得不是很好看,而如果用方式二的话就不存在这种情况,效果大家知道我就不上图了,举这个例子就是想告诉大家,要根据业务场景选择合适的实现方式。

Android6.0及以上

之所以又分了这一个阶段,是因为我们在5.0~6.0阶段发现了一个小问题,就是当我们要给状态栏设置的颜色是白色或者浅色的时候,因为默认的状态上图标的颜色是白色就会造成看不清的现象,如下图所示


浅色状态栏.jpg

为了避免这种情况,Android系统在6.0的时候增加了一个属性SYSTEM_UI_FLAG_LIGHT_STATUS_BAR,此前已经介绍过这个属性,这里不再赘述,使用了它以后,状态栏上的图标文字就会默认使用黑色绘制。

activity.getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            activity.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
            activity.getWindow().setStatusBarColor(color);
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
                activity.getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);
            }

设置完以后的效果


设置了浅色主题的情况.jpg

这里再补充一个小知识:小米和魅族系统在Android5.0修改自家系统的源码,因此他们在5.0的时候就提供这个API,也就是说小米和魅族Android5.0系统的手机就支持了浅色主题模式。

为什么我不建议大家使用轮子

其实我看网上关于沉浸式的轮子,都是基于以上方法封装的一个工具类而已,我不推荐大家使用轮子,是因为当你自己的业务场景有特殊要求的时候(例如骨架图的情况),可能当前的轮子会不适应你的业务场景,所以掌握好核心知识才是最关键的,如果一定要用轮子,你掌握了这篇文章,自己造一个岂不是更好吗?

总结

本文首先介绍了关于实现沉浸式状态栏的4个核心api,并对其关键的属性做了详细的描述,然后又介绍了沉浸式状态栏发展的三个阶段,并对特殊情况的一些处理,相信你只要认真读了这篇文章,你一定已经掌握了沉浸式的核心知识。如果你觉得本文不错,请点个赞,谢谢!

上一篇 下一篇

猜你喜欢

热点阅读