在项目中发现Android和iOS在手机状态栏样式不一样,然后就查到有一个cordova插件可以解决这个问题

1.下载插件$cordovaStatusbar命令:

cordova plugin add https://github.com/apache/cordova-plugin-statusbar.git

2.在config.xml里面配置如下:

<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar"/>
</feature> 将此配置改为:
<preference name="Fullscreen" value="false"/>(否则在Android上状态栏显示不出来)

3.在app.js里面,如下:

判断手机是android 还是iOS来定义不同的样式,我的这个是在Android和iOS上都是背景色为黑色,字体为白色

  1. if (cordova.platformId == 'android') {
  2. StatusBar.backgroundColorByHexString("#333");
  3. }else{
  4. $cordovaStatusbar.overlaysWebView(false);
  5. $cordovaStatusbar.style(1);
  6. StatusBar.styleLightContent();
  7. $cordovaStatusbar.styleColor('black');
  8. }

4.最后iOS结果如图:

ionic项目中手机状态栏显示使用$cordovaStatusbar插件的更多相关文章

  1. ionic 项目中使用ngCordova插件$cordovaCamera筛选手机图库图片显示出来并上传

    原文档请看http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/ionic%E5%9B%BE%E7%89%87%E4%B8%8A%E4%B ...

  2. Ionic项目中使用极光推送

    Ionic项目中使用极光推送-android   对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档) ...

  3. Ionic项目中使用极光推送-android

    对于Ionic项目中使用消息推送服务,Ionic官方提供了ngCordova项目,这个里面的提供了用angularjs封装好的消息推送服务(官方文档),使用的是GitHub上的 PushPlugin ...

  4. Ionic项目中如何使用Native Camera

    本文介绍如何在ionic项目中使用设备的camera. Ionic版本:v3.2.0 / 2017-05-10 / MIT Licensed / Release Notes ============= ...

  5. ionic 项目中 使用 sass

    注: 1.先安装node-sass  -->> npm install --save node-sass --registry=https://registry.npm.taobao.or ...

  6. Cordova各个插件使用介绍系列(七)—$cordovaStatusbar手机状态栏显示

    在项目中发现Android和iOS在手机状态栏样式不一样,然后就查到有一个cordova插件可以解决这个问题 1.下载插件$cordovaStatusbar命令: cordova plugin add ...

  7. laravel项目中手机浏览器在线阅读pdf文件-->PDFJS插件

    第一步:下载链接:http://mozilla.github.io/pdf.js/getting_started/#download 第二步:将下载的文件放在项目中. 第三步:在项目中想要预览的地方给 ...

  8. ionic 项目中添加modal的步骤流程

    1.首先在templates文件夹下面定义一个新页面,xxx.html,template文件夹在空项目里面是没有的,需要手动添加一个,放在WWW文件夹下面. <ion-modal-view> ...

  9. 管理项目中的贴图-Texture overview插件

    Texture overview插件管理项目中的贴图 1. Assetstore地址 2. 总览项目中所有贴图 3. 针对不同平台的贴图压缩设置 在插件的右上角 4. 支持多选批量修改 5. 点击表头 ...

随机推荐

  1. Makefile使用库

    这篇文章演示了Makefile使用mysqlpp库和lua库的写法. test.cpp: #include <iostream> #include <stdint.h> #in ...

  2. Java数据结构之队列的实现以及队列的应用之----简单生产者消费者应用

    Java数据结构之---Queue队列 队列(简称作队,Queue)也是一种特殊的线性表,队列的数据元素以及数据元素间的逻辑关系和线性表完全相同,其差别是线性表允许在任意位置插入和删除,而队列只允许在 ...

  3. CURL命令详解

    curl命令是一个强大的网络工具,它能通过http,ftp等方式下载.上传文件.其中curl远不止这些功能,大家可以通过阅读手册获取更多的信息,类似的工具还有wget. curl命令使用了libcur ...

  4. java是值传递还是引用传递

    首先写一个简便的Employee,以便测试使用. class Employee { private String name; public Employee(String name) { this.n ...

  5. 税收基础知识 > 三税(营业税, 增值税, 所得税) + 关税

    三税:营业税 ▪ 增值税 ▪ 所得税 主要关注:一般纳税人, 起征点不详细描述. 营业税(Business tax) 营业税(Business tax),是对在中国境内提供应税劳务.转让无形资产或销售 ...

  6. Centos7 关闭防火墙(Firewalld ),使用防火墙(iptables)

    1.直接关闭防火墙 systemctl stop firewalld.service: #停止firewall systemctl disable firewalld.service: #禁止fire ...

  7. windows页面打印div(弹出新页面)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  8. Eclipse中安装配置Tomcat

    Eclipse(4.4.x及以上)中安装配置Tomcat 以下配置说明全部针对免安装版本 基于tomcat的安装目录和运行目录是可以不同的,本文都会进行说明 首先简单介绍一下tomcat的目录结构,一 ...

  9. jquery.validate 使用--验证表单隐藏域

    jQuery validate很不错的一个jQuery表单验证插件.升级到了1.9版的后,发现隐藏表单域验证全部失效,特别是在jquery.ui.tabs.min.js构造的Tabs里的验证. 是因为 ...

  10. SQL出错

    2016-12-26 15:43:02,870 DEBUG [org.springframework.test.context.support.DirtiesContextTestExecutionL ...