首页 > 代码库 > ionic项目中手机状态栏显示使用$cordovaStatusbar插件
ionic项目中手机状态栏显示使用$cordovaStatusbar插件
在项目中发现Android和iOS在手机状态栏样式不一样，然后就查到有一个cordova插件可以解决这个问题
1.下载插件$cordovaStatusbar命令：
cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git2.在config.xml里面配置如下：
<feature name="StatusBar">
<param name="ios-package" onl oad="true" value="http://www.mamicode.com/CDVStatusBar"/>
</feature>
将此配置改为：
<preference name="Fullscreen" value="http://www.mamicode.com/false"/>（否则在Android上状态栏显示不出来）
3.在app.js里面，如下：
判断手机是android 还是iOS来定义不同的样式，我的这个是在Android和iOS上都是背景色为黑色，字体为白色
[javascript] view plain copy
- if (cordova.platformId == ‘android‘) {
- StatusBar.backgroundColorByHexString("#333");
- }else{
- $cordovaStatusbar.overlaysWebView(false);
- $cordovaStatusbar.style(1);
- StatusBar.styleLightContent();
- $cordovaStatusbar.styleColor(‘black‘);
- }
4.最后iOS结果如图：
ionic项目中手机状态栏显示使用$cordovaStatusbar插件
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。