一、 前言
状态栏就是手机屏幕最顶部的区域,包括了:信号、运营商、电量等信息。通常APP都有属于自己的色调风格,为了达到整体视觉美观,通常会设置状态栏和标题栏的色调设置成一致。
图例:
二、状态栏状态类型
- 默认
- 变色(设置颜色)
- 透明(沉浸式)
- 消失(全屏)
三、状态栏变色
1.效果如图:
2.根据色调设置状态栏文字颜色,文字颜色只提供两种值:light(白色)、dark(黑色)
3.设置标题栏背景颜色
4.设置状态栏背景颜色,颜色值为16进制
示例代码:
View Code
注意事项:
背景色终端支持仅:Android5及以上系统支持;iOS7.0及以上系统支持。
文字色终端支持仅:Android5只有小米和魅族支持,Android6及以上所有安卓支持;iOS7及以上支持。
四、状态栏透明(沉浸式)
1.效果如图:
(将背景图片和状态栏、标题栏贯通了)
2.运用实战(登录界面)
需求描述:将背景设置成图片,图片可以适应不同设备的分配率(响应式),将状态栏的背景设置成透明,背景图片覆盖状态栏至屏幕顶部。
设置页面背景
针对背景色的色调设置状态栏文字的颜色
打开应用的manifest.json文件,切换到代码视图,在plus -> statusbar 下添加immersed节点并设置值为true
3.沉浸式延伸的问题
由于沉浸式模式是在manifest.json文件配置,作为了一个固定全局的设置,沉浸式的设置可能只是针对部分页面,那么对其他的页面都牵连了。
导致的效果如图:
(状态栏的高度被忽略)
解决代码:
background属性,设置状态栏的背景色。
五、 全屏显示(没有状态栏)
在应用中可调用5+ API动态改变应用是否全屏显示的状态: