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节点:

 

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

 

相关文章
|
2月前
|
前端开发 图形学 开发者
【独家揭秘】那些让你的游戏瞬间鲜活起来的Unity UI动画技巧:从零开始打造动态按钮,提升玩家交互体验的绝招大公开!
【9月更文挑战第1天】在游戏开发领域,Unity 是最受欢迎的游戏引擎之一,其强大的跨平台发布能力和丰富的功能集让开发者能够迅速打造出高质量的游戏。优秀的 UI 设计对于游戏至关重要,尤其是在手游市场,出色的 UI 能给玩家留下深刻的第一印象。Unity 的 UGUI 系统提供了一整套解决方案,包括 Canvas、Image 和 Button 等组件,支持添加各种动画效果。
122 3
|
3月前
|
移动开发 前端开发 JavaScript
惊爆!一键解锁HTML父页面神秘技能,子页面Dialog华丽登场,让你的网页交互瞬间高大上,用户体验飙升!
【8月更文挑战第4天】在Web开发中,常需从父页面弹出子页面或对话框(Dialog)进行互动。HTML5虽引入了<dialog>元素,但许多开发者偏好使用自定义方案以获得更好的兼容性和样式控制。本示例利用HTML、CSS及JavaScript创建一个可弹出子页面的模态框:首先,在父页面中定义一个按钮触发弹出效果;接着,设置隐藏的模态框容器,内含一个iframe用于加载子页面;然后,通过CSS设定模态框样式;最后,借助JavaScript控制模态框的显示与隐藏。此方案灵活且易于定制,适用于多种应用场景。
89 12
|
3月前
|
前端开发
类抖音logo的光影之旅:CSS动画效果,让标志更具吸引力!
类抖音logo的光影之旅:CSS动画效果,让标志更具吸引力!
|
6月前
【实用】一个移动端简单的UI弹窗组件,虽算不上高大上,但至少耐看
【实用】一个移动端简单的UI弹窗组件,虽算不上高大上,但至少耐看
|
前端开发 程序员
CSS实现虚拟变化主题键盘
CSS实现虚拟变化主题键盘
|
JavaScript
原生js做无限弹窗(娱乐)
原生js做无限弹窗(娱乐)
86 0
|
Java
手把手一步一步教你使用Java开发一个大型街机动作闯关类游戏20之enemy被攻击显示后退动画(block效果)
手把手一步一步教你使用Java开发一个大型街机动作闯关类游戏20之enemy被攻击显示后退动画(block效果)
164 0
SwiftUI—预览视图在正常模式和黑暗模式下的效果
SwiftUI—预览视图在正常模式和黑暗模式下的效果
144 0
SwiftUI—预览视图在正常模式和黑暗模式下的效果
|
前端开发 JavaScript 容器
如何用纯 CSS 创作一个飞机舷窗风格的 toggle 控件
效果预览 在线演示 按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。 https://codepen.io/comehope/pen/jeaOrw 可交互视频 此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。
1105 0