MUI控制状态栏颜色沉浸式状态栏（变色）附带2种方式

MUI 控制状态栏颜色 沉浸式状态栏（变色）附带2种方式

在Andriod 4.0+的时候Google就开放了这个,可是到现在的Andriod 9.0了还是有很多应用没有去适配
小软件就算了，可是有些大软件你们怎么了,适配一下会死啊 会死啊 会死啊 CNMM

首先我们看下效果 （图片来自网络,为啥呢 因为枫瑞博客刚刚买了一部美人尖手机 还是9.0系统哦 ）

2中方式去实现 推选方式一 因为简单但是也有一些小不足

方式一：(推选)

首先在界面添加script标签添加如下代码

function plusReady(){ // 设置系统状态栏背景为蓝色 plus.navigator.setStatusBarBackground( "#007AFF" ); // 设置系统状态栏样式为浅色文字 plus.navigator.setStatusBarStyle( "UIStatusBarStyleBlackOpaque" ); } if(window.plus){ plusReady(); }else{ document.addEventListener("plusready",plusReady,false); }

这样就建立了一个状态栏的颜色,随后我们在mui的header 中添加背景颜色style，在head部分添加style标签 添加如下代码

 .mui-bar{background-color:#ff0707} /*设置为蓝色*/ .mui-title{color:ffffff} /*标题颜色为白色*/ 

这样的话 每个新的界面都是在设置一次， 在设置为时候不要忘记了字体的颜色，如果无法修改header颜色的话 那就行内修改了

方式二：

方式二麻烦 是真的麻烦
首先在manifest.json文件下的plues中添加

"plus": { "splashscreen": { "autoclose": true,/*是否自动关闭程序启动界面，true表示应用加载应用入口页面后自动关闭；false则需调plus.navigator.closeSplashscreen()关闭*/ "waiting": true }, "launchwebview": { "statusbar": { "background": "#ff0707"/*设置状态栏颜色*/ } }, "statusbar":{ "immersed":true /*开启沉浸式*/ },

添加好了后 如果首页加代码
首先无论是launchwebview还是secondwebview，都是在manifest.json中配置相关的参数信息。
manifest.json->plus->launchwebview

无标题

webview = plus.webview.create('test.html', 'test', { statusbar: { background: '#1478ee' } });

有头部标题

webview = plus.webview.create('test.html', 'test', { titleNView: { titleText: '测试页', backgroundColor: '#fb6f18' } });