cordova插件使用(一套流程适用于每个插件使用)

来源:互联网 发布:结构化面试 知乎 编辑:程序博客网 时间:2024/03/29 02:25

iOS 状态栏的控制我是这么实现的:

  1. 访问http://plugins.cordova.io/, 您可以在其中搜索cordova插件,例如我搜下statusbar:
    插件管理页面搜索statusbar结果

    会发现有两个插件。其中下面的名字貌似更官方一点,我们就选择这个作为我们需要的插件。

  2. 插件的安装很简单。我们需要的只是插件的ID, 也就是org.apache.cordova.statusbar. 然后打开终端,然后到cd到自己的项目根目录,输入或粘贴如下代码:
    cordova plugin add org.apache.cordova.statusbar

    回车,稍等片刻会有类似下面的提示:
    statusbar安装代码以及提示

    说明安装成功。虽说安装是成功了,但到底该如何使用呢?

  3. 一般这种插件都会在GitHub上开源,Google或Github上搜索org.apache.cordova.statusbar,很快我们就会找到这个插件的Github地址:https://github.com/jonathannaguin/org.apache.cordova.statusbar.

    点击进入,众API们引入眼帘,好像黑夜看到了曙光,屌丝看到了女神……

    方法如下:

    • StatusBar.styleDefault 状态栏默认样式,也就是电池信号黑色;
    • StatusBar.styleLightContent 状态栏内容浅色,貌似就是白色,适合深色背景;
    • StatusBar.styleBlackTranslucent 状态栏黑色半透明,我测了下,跟上面一样的效果,电池时间都是白色的,适合深色背景;
    • StatusBar.styleBlackOpaque 状态栏黑色不透明。我测了下,还是白色的,跟上面一样,适合深色背景;
    • StatusBar.hide 状态栏隐藏;
    • StatusBar.show 状态栏显示;
  4. 只要你使用了Cordova的插件(相机啊,地址位置等),你就得调用自动生成的cordova.js.
    <script src="cordova.js"></script>

    然后,再你自己的JS中,使用类似StatusBar.hide()就可以隐藏状态栏啦!或者使用StatusBar.styleLightContent()让状态栏从黑人变成白人,如下效果:
    顶部的白色状态栏效果截图

其他非官方插件的使用也是类似上面的步骤。

0 0