在安卓上处理状态栏,真的是一个非常痛苦的问题,倒不是说给状态栏调整颜色什么有多难,关键问题还是在于要在适配时考虑各种类型设备上都能够获得一个最优的使用体验,同时考虑这么多的类型,还要考虑界面布局,避免因为适配引入新的问题,避免带来界面观看体验提升的同时带来的操作体验的缺失。接下来我们先来看一下市面上的安卓设备的状态栏的屏幕,大致分为哪几类。
1、普通屏幕
在普通状态栏的时候,我们适配时通常就只需要考虑安卓版本的问题了。安卓4.4以上支持沉浸式状态栏(透明状态栏),但在安卓4.4上透明状态栏的样式也比较丑,而且做透明状态栏的时候还要考虑布局偏移等问题,更改状态栏的颜色需要自己做一个假的状态栏布局,手动更改背景颜色。从安卓5.1开始系统对于状态栏有了更进一步的支持,不再需要做布局偏移了,也不需要假状态栏了,而且支持更改颜色。从安卓6.0,MIUI V6+,Flyme 4.0+开始,支持白底黑字的状态栏,状态栏可以变得更加美观,但在做白底黑字的状态栏同时,也要考虑旧版本的设备的显示情况,根据不同的版本做不同的调整。
2、刘海屏幕(凹形屏)
(1)又宽又高的刘海屏
刘海屏幕这里粒度再分的细一点,因为不同的刘海设备,对于用户体验的影响是不同的,我们先来看一种设备,刘海又宽又高的:
刘海屏安卓官方提供支持是从Android P开始的。但其实国内的手机厂商对于凹形屏的支持是早于Android P的,这就让使用安卓标准API可能还是无法兼容大多数刘海屏的安卓设备,这就非常的坑了。
上图展示的两种刘海屏对于状态栏的视觉影响都比较大,在适配这种刘海屏的时候,可能沉浸的内容被遮挡的过多,背景上的一些内容在作图的时候就需要考虑重要内容下移,但这种下移对于其他类型屏幕的就有视觉上的影响。另外,顶部有一些可操作的区域,在这种设备上可能会被凹陷的区域所遮挡,较低操作体验,在功能设计的时候,就需要考虑把顶部的操作做偏移,或者换个地方,考虑其他可操作区域。
(2) 又窄又矮的刘海屏
得益于技术的进步以及厂商对于用户体验的追求,刘海屏在随后的发展中可以变的更加窄更加矮,对于又宽又高的刘海屏带来的影响,也就更加相应的弱化一些了。但是我们在开发的时候,一套代码,一套布局是要适应不同的设备屏幕,我们无法知道设备的刘海屏到底怎样,所以在开发过程中还是要以最坏的情况去做打算。
3、 美人尖
美人尖屏幕市面上机型并不多,比较知名的几个机型是: Essential Phone ,坚果R1等。
美人尖设备能够带来比刘海屏更为美观的体验,但另一体验上还是会让人有些膈应。我们开发时候的适配,在这种类型的设备上,可能出现的视觉体验以及操作体验的问题会变得更小,适配的时候,花费的精力也可以更少。
4、水滴屏
水滴屏是美人尖的升级版,在视觉体验,用户体验上,有更大的进步,同样,也更能进一步减小我们适配的难度,减少用户操作体验上的缺失。
以上列举了几种屏幕,在开发过程中,凡事涉及到状态栏的问题,我们不光要从安卓版本去考虑实现的可能与可能的问题,在不同的屏幕类型上也要去考虑不同的屏幕可能带来的后果。考虑到用户的视觉体验和操作体验,常规的布局,是没有什么问题的,但是在某些比较特殊的布局上,就需要格外注意了。如果能够在产品层面,UI设计层面提前考量这些问题,无疑能够减少开发很多的工作量和减少适配难度,兼容更多的设备,对于用户的视觉和操作体验,也是极大的提升。
以下再举一些比较容易适配的案例:
透明状态栏,白字
白底黑字状态栏,同理还有黑字白底状态栏,没有特殊布局(CoordinatorLayout包裹实现一些特别的效果或者自定义实现的其他效果)
接下来看一些不好的案例:
这两种布局状态设计在视觉体验上就不是很合理了。状态栏与视频播放器及开始播放按钮看起来就不协调,不美观。但是如果做沉浸式状态栏,播放器背景和开始播放按钮沉浸上去了,更加美观好看,也增加了整个页面可视区域,但是在凹形屏手机上(刘海屏,美人尖,水滴屏),凹陷区域就会遮挡播放器的标题及其他操作区域,导致用户无法点击顶部区域。所以妥协的办法就是不要去使用状态栏,但这样的做法导致页面布局的视觉效果不协调,牺牲了一定的美观。类似这样的布局,都需要去做细致的考量,如果能够从设计角度思考其他的布局方式,或许可以带来既美观又不影响操作体验的解决方案。
再补充一些内容:
在做性能优化的时候,我们也往往会考虑进行过度绘制的优化,即把Activity的背景去掉。但是在在一些安卓版本上,在布局中或者代码中,如果我们对于状态栏调整的实现方案是将界面的布局下移一个状态栏的高度,同时设置activity的背景的布局颜色,以此来达到对状态栏调整的目的,此时我们为了防止过度绘制,在theme里去除windowBackground就会失效,那么最终结果还是过度绘制了,给我们的性能优化还帮了倒忙。有些第三方状态栏库中,对状态栏颜色更改的实现,就是通过修改Activity背景颜色来实现的,在处理性能优化的时候,这一块也要格外小心。