DCloud_App_Array
DCloud_App_Array
  • 发布:2014-07-25 21:23
  • 更新:2021-05-26 11:09
  • 阅读:144705

iOS平台设置系统状态栏(通知栏、顶部状态栏)样式背景颜色或透明

分类:HTML5+

配置系统状态栏样式

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

| 值 | 样式 |
| :-------- | :-------- |
| UIStatusBarStyleDefault | 默认样式,iOS6及以下系统状态栏为黑底白字,iOS7及以上系统用于定义系统状态栏上文字颜色为黑字(适用于浅色背景) |
| UIStatusBarStyleBlackOpaque | 深色背景色样式,iOS6及以下系统状态栏为黑底白字,iOS7及以上系统用于定义系统状态栏上文字颜色为白色(适用于深色背景)|
| UIStatusBarStyleBlackTranslucent | iOS6及以下系统在启动界面为灰底白字,iOS7及以上系统与UIStatusBarStyleBlackOpaque效果一样 |

App云端打包设置系统状态栏样式操作方式:
双击应用的manifest.json文件,切换到“代码视图”,在plus->statusbar下添加style节点:

Ctrl+S保存,并提交App云端打包

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

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

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

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

Ctrl+S保存,并提交App云端打包

###运行期动态设置系统状态栏背景颜色

调用plus.navigator.setStatusBarBackground(rgb)动态修改系统状态栏背景颜色:
rgb为颜色字符串值,格式为#RRGGBB。

function setStatusbarRed(){  
		// 设置系统状态栏背景色为红色  
		plus.navigator.setStatusBarBackground("#FF0000");  
}

注:仅在iOS7.0及以上版本才支持设置系统状态栏背景色

设置状态栏透明并且页面内容通顶,参考http://ask.dcloud.net.cn/article/118

Android平台
Android平台自定义系统状态栏样式,参考状态栏大全-状态栏透明(沉浸式)、变色及全屏的区别

Android离线打包在AndroidManifest.xml中配置主Activity的皮肤(android:theme)来设置:

        <activity  
            android:name="io.dcloud.PandoraEntry"  
            android:configChanges="orientation|keyboardHidden|screenSize"  
            android:label="@string/app_name"  
            android:launchMode="singleTask"  
            android:screenOrientation="sensor"  
            android:windowSoftInputMode="adjustResize"  
            android:theme="主Activity的皮肤"  
            android:exported="true">  
            <intent-filter>  
                <action android:name="android.intent.action.MAIN"/>  
                <category android:name="android.intent.category.LAUNCHER"/>  
            </intent-filter>  
        </activity>

后续云端打包会封装常用的皮肤样式。参考:http://ask.dcloud.net.cn/docs/#http://ask.dcloud.net.cn/article/238

14 关注 分享
小杨 蔡繁荣 Snoopy HenryYong keny ___K Caven 小岳岳 suci Roko Trust 健健 2***@qq.com i***@163.com

要回复文章请先登录注册

s***@163.com

s***@163.com

回复 越仔 :
我的也是,mainfest.json也该修改了,meta也修改为viewport-fit=cover了,但是还是不生效。(我的是老项目huiblder迁移到hbuilderx)
2021-05-26 11:09
越仔

越仔

设置了ios沉浸式不生效
2020-08-17 11:20
edobnet

edobnet

使用:UIStatusBarStyleBlackTranslucent ,iphonex怎么是黑色,iphone6 plus是可以的
2018-02-24 09:31
23dreamer

23dreamer

回复 Arliang :
问一个啊,我设置了还是不行怎么办啊。。。。
2017-12-12 15:04
阿星蜀黍

阿星蜀黍

马克
2017-09-26 16:16
2***@qq.com

2***@qq.com

真的好垃圾,无论如何设置,都是黑色字体
2017-08-16 01:41
Arliang

Arliang

离线打包设置不了透明的小伙伴们看这里,WebAppController 下面有一个statusbar的view
这是它的高度设置:
【Swift】var kStatusBarHeight:CGFloat = 20
【Obj-C】#define kStatusBarHeight 20.f
设置成0让它消失就好了

然后在html中用这个设置状态栏颜色
plus.navigator.setStatusBarStyle("UIStatusBarStyleBlackTranslucent");
UIStatusBarStyleDefault 默认风格(白色状态栏上有黑色文字)
UIStatusBarStyleBlackTranslucent 黑色透明状态栏,白色文字
UIStatusBarStyleBlackOpaque 黑色不透明状态栏,白色文字
(引用自@xinz的评论)
2017-07-27 12:09
7***@qq.com

7***@qq.com

回复 m***@qq.com :
"plus": {
"statusbar":{
"style":"UIStatusBarStyleBlackOpaque"
},
}
你是这样写的吗?我改过之后,连电脑真机运行没用,必须要云打包才能看效果吗?
2017-06-09 18:46
m***@qq.com

m***@qq.com

我比你们遇到的问题更坑,我在本地是生效的,打包之后就不生效了。
2017-03-31 14:20
1***@qq.com

1***@qq.com

问题1:ios状态栏的背景怎么设置为透明底?
2016-11-22 18:00