1.在项目根目录下(我的是com.chl),添加一个文件夹,在文件夹里添加src、www两个子文件夹和plugin.xml文件。在www目录下,创建test.js。在src文件夹下添加android子目录(--为了区分平台,android/ios...--),在android目录下添加chl文件夹(--包名--),在chl目录下添加TestPlugin.java文件。
2.打开test.js文件,添加getName方法:
var exec = require("cordova/exec");
var test = {
/**
* getName方法
* @param successCallback:成功的回调函数
* @param errorCallback:失败的回调函数
*/
getName: function(successCallback, errorCallback){
/**
* 调用TestPlugin.java
* action = getName
*/
cordova.exec(successCallback, errorCallback, "TestPlugin", "getName", []);
}
}
module.exports = test;
打开TestPlugin.java文件:
package chl;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;
import org.json.JSONArray;
import org.json.JSONException;
public class TestPlugin extends CordovaPlugin {
public static final String ACTION_GET_NAME = "getName";
@Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
try{
if(ACTION_GET_NAME.equals(action)){
callbackContext.success("张三");
return true;
}
callbackContext.error("action是不getName");
return false;
}catch(Exception e){
System.out.println("异常信息: " + e.getMessage());
callbackContext.error(e.getMessage());
return false;
}
}
}
打开plugin.xml配置插件:
<?xml version="1.0" encoding="UTF-8"?>
<plugin xmlns="http://www.phonegap.com/ns/plugins/1.0"
xmlns:android="http://schemas.android.com/apk/res/android"
id="cordova-plugin-chenhlTest" version="1.0.0"><!-- id为插件的名称,插件安装后会在plugins目录下出现cordova-plugin-chenhlTest文件夹 -->
<name>chenhlTest</name>
<description>my test plugin ...</description><!-- 描述 -->
<license>no license ...</license>
<engines>
<engine name="cordova" version=">=3.0.0" /><!-- 适用版本 -->
</engines>
<js-module src="www/test.js" name="Test">
<clobbers target="cordova.plugins.chenhlTest" /><!-- 调用时的名称 -->
</js-module>
<platform name="android"><!-- 以下是android平台配置信息 -->
<source-file src="src/android/chl/TestPlugin.java" target-dir="src/chl" /><!-- java源代码 -->
<config-file target="res/xml/config.xml" parent="/*">
<feature name="TestPlugin">
<param name="android-package" value="chl.TestPlugin"/><!-- 指向src/android/chl/TestPlugin.java文件 -->
</feature>
</config-file>
<config-file target="AndroidManifest.xml">
<!--<uses-permission android:name="android.permission.READ_PHONE_STATE" />--><!-- android权限 -->
</config-file>
</platform>
</plugin>
至此代码写完了,接下来就是安装插件。
3.安装插件
打开cmd,并进到项目的根目录。
执行命令:
cordova plugin add chenhl
注:chenhl就是最先创建的文件夹名称
正确执行完命令后,就可以在项目的plugins目录下,看到cordova-plugin-chenhlTest插件了。
4.调用插件
在页面上添加按钮
<button class="button-full button button-positive" ng-click="pluginTest();">测试自定义插件</button>
在对应的controller:
$scope.pluginTest=function(){
//cordova.plugins.chenhlTest:plugin.xml文件中配置在clobbers中的
cordova.plugins.chenhlTest.getName(function(name){
alert(name);
}, function(err){
alert(err);
});
}
5.测试结果