Mui沉浸模式以及状态栏颜色改变

简介: 沉浸模式只需要设置下就可以 ios:  打开应用的manifest.json文件,切换到代码视图,在plus -> distribute -> apple 下添加UIReserveStatusbarOffset节点并设置值为false。

沉浸模式只需要设置下就可以 
ios: 
打开应用的manifest.json文件,切换到代码视图,在plus -> distribute -> apple 下添加UIReserveStatusbarOffset节点并设置值为false。 
注意: 
1. 真机运行不生效,需提交App云端打包后才生效; 
2. 此功能仅在iOS7及以上系统有效。 
android: 
打开应用的manifest.json文件,切换到代码视图,在plus -> distribute -> google 下添加ImmersedStatusbar节点并设置值为true。 
注意: 
1. 真机运行不生效,需提交App云端打包后才生效; 
2. 此功能仅在Android4.4及以上系统有效。

配置系统状态栏样式

iOS平台可支持对系统状态栏样式的配置,在应用manifest.json文件的plus->distribute->apple下添加UIStatusBarStyle进行控制,默认值为"UIStatusBarStyleDefault"。

 

UIStatusBarStyleDefault  默认样式,iOS6及以下系统状态栏为黑底白字,iOS7及以上系统用于定义系统状态栏上文字颜色为黑字(适用于浅色背景)

 

UIStatusBarStyleBlackOpaque  深色背景色样式,iOS6及以下系统状态栏为黑底白字,iOS7及以上系统用于定义系统状态栏上文字颜色为白色(适用于深色背景)

 

UIStatusBarStyleBlackTranslucent  iOS6及以下系统在启动界面为灰底白字,iOS7及以上系统与UIStatusBarStyleBlackOpaque效果一样

 

设置系统状态栏背景颜色(iOS7及以上生效)

iOS平台可支持对系统状态栏背景颜色的配置,在应用manifest.json文件的plus->distribute->apple下添加StatusBarBackground进行控制:
值为字符串类型,格式为"#RRGGBB"格式,如红色为"#FF0000";默认值为白色。

App云端打包设置系统状态栏背景颜色操作方式

双击应用的manifest.json文件,切换到“代码视图”,在apple节点下添加StatusBarBackground节点:

 

使用之后要注意沉浸模式所带来的样式的改变,如果要使用沉浸模式,最好在开发之初就设置好.

 

相关文章
|
17天前
【实用】一个移动端简单的UI弹窗组件,虽算不上高大上,但至少耐看
【实用】一个移动端简单的UI弹窗组件,虽算不上高大上,但至少耐看
|
2月前
|
前端开发 JavaScript API
|
6月前
|
前端开发 程序员
CSS实现虚拟变化主题键盘
CSS实现虚拟变化主题键盘
|
9月前
|
JavaScript
原生js做无限弹窗(娱乐)
原生js做无限弹窗(娱乐)
43 0
|
11月前
|
Java
手把手一步一步教你使用Java开发一个大型街机动作闯关类游戏20之enemy被攻击显示后退动画(block效果)
手把手一步一步教你使用Java开发一个大型街机动作闯关类游戏20之enemy被攻击显示后退动画(block效果)
134 0
|
前端开发 容器
通俗重制系列--Grid布局
通俗重制系列--Grid布局
106 0
|
弹性计算 前端开发 容器
通俗重制系列--CSS布局
通俗重制系列--CSS布局
130 0
通俗重制系列--CSS布局
|
前端开发
「CSS畅想」我的发呆专属,反复解锁手机屏幕
前端玩转CSS,可以创造出不少有趣的效果。今天实现了一个解锁手机屏幕的效果,简单的快乐。
132 1
|
前端开发
小视频源码,可控的跑马灯,无需焦点
小视频源码,可控的跑马灯,无需焦点
259 0
|
前端开发
如何用纯 CSS 创作一种按钮被瞄准的交互特效
效果预览 按下右侧的“点击预览”按钮在当前页面预览,点击链接全屏预览。 在线演示 https://codepen.io/zhang-ou/pen/ELWMLr 可交互视频教程 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。
1172 0