1.下载plugman

npm install -g plugman

2.创建插件命令

plugman create --name <pluginName> --plugin_id <pluginID> --plugin_version <version> [--path <directory>] [--variableNAME=VALUE]

参考例子

plugman create --name WoodyPlugin --plugin_id woodyPlugin --plugin_version 0.0.1

3.参数介绍:
pluginName: 插件名字
pluginID: 插件id : woodyPlugin
oversion: 版本 : 0.0.1
directory:一个绝对或相对路径的目录,该目录将创建插件项目
variable NAME=VALUE: 额外的描述,如作者信息和相关描述

4.生成插件的文件目录

clipboard.png

5.根据在不同平台(ios,android,winphone)开发,一般在src目录上创建不同平台的文件夹,下面以android项目举例子,在src下创建一个android目录和一个空Test.java类

clipboard.png

6.plugin.xml的配置

打开plugin.xml你会看到如下已经生成的配置

<?xml version='1.0' encoding='utf-8'?>  
<plugin id="woodyPlugin" version="0.0.1" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">  
    <name>WoodyPlugin</name>  
    <js-module name="WoodyPlugin" src="www/WoodyPlugin.js">  
        <clobbers target="cordova.plugins.WoodyPlugin" />  
    </js-module>  
</plugin>

参数介绍:

id: 插件的id
version: 插件的版本
name: 插件的名字
clobbers: 这个是js代码调用原生代码的引用

7.WoodyPlugin.js的配置

打开WoodyPlugin.xml你会看到如下已经生成的配置

var exec = require('cordova/exec');  
  
exports.woodyMethod = function(arg0, success, error) {  
    exec(success, error, "WoodyPlugin", "woodyMethod", [arg0]);  
};  

8.完整plugin.xml和WoodyPlugin.js

plugin.xml

<?xml version='1.0' encoding='utf-8'?>  
<plugin id="woodyPlugin" version="0.0.1" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">  
    <name>WoodyPlugin</name>  
    <js-module name="WoodyPlugin" src="www/WoodyPlugin.js">  
        <clobbers target="woody.plugins.WoodyPlugin" />  
    </js-module>  
  
    <platform name="android">  
        <source-file src="src/android/Test.java" target-dir="src/com/woody/plugins"/>  
  
        <config-file target="res/xml/config.xml" parent="/*">  
            <feature name="Test">  
                <param name="android-package" value="com.woody.plugins.Test"/>  
            </feature>  
        </config-file>  
    </platform>  
</plugin>

WoodyPlugin.js

var exec = require('cordova/exec');  
  
exports.woodyMethod = function(arg0, success, error) {  
    exec(success, error, "WoodyPlugin", "woodyMethod", [arg0]);  
};  

看到plugin.xml在之前的基础上新加了<platform>节点.其中feature对应着WoodyPlugin.js中exec(success, error, "WoodyPlugin", "woodyMethod", [arg0]);第3个参数,这个两处的参数必须一致,不然插件调用不起来,exports.woodyMethod和第4个参数也必须一致,这个是调用原生代码中的方法.

9.插件的安装

我的插件所在的路径是D:WoodyPlugin
首先切换到自己创建android工程的目录 cd YourProjectName
执行插件安装命令 cordova plugin add D:WoodyPlugin
执行完之后你就发现插件已经安装上去了
如果你想卸载插件的话,执行cordova plugin remove 你的plugin_id

cordova plugin remove WoodyPlugin

10.完善Test.java插件类

import org.apache.cordova.CallbackContext;  
import org.apache.cordova.CordovaPlugin;  
import org.json.JSONArray;  
import org.json.JSONException;  
  
public class Test extends CordovaPlugin{  
  private CallbackContext mCallbackContext;  
  @Override  
  public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {  
    this.mCallbackContext = callbackContext;  
    if("woodyMethod".equals(action)){  
      String msg = args.getString(0);    
      callbackContext.success("success"+msg);  
      return true;  
    }  
    mCallbackContext.error("error");  
    return false;  
  }  
}  

if(“woodyMethod”.equals(action))中的woodyMethod对应WoodyPlugin.js中的exports.woodyMethod和exec方法的第4个参数

11.在js中如何调用

找到cordova_plugins.js文件,在该文件中找到你创建插件clobbers的属性,以我的插件为例,clobbers是woody.plugins.WoodyPlugin。

在js调用时就可以按照如下命令调用

woody.plugins.WoodyPlugin.woodyMethod('Hello woody!',function(msg){  
  alert(msg);  
},function(msg){  
  alet(msg);  
})

hellowoody
118 声望10 粉丝

个人网站:woodyhello.com


引用和评论

0 条评论