cordova 插件开发

创建插件：

1.安装plugman

npm install -g plugman

2.创建插件

plugman create --name [插件名] --plugin_id [插件id] --plugin_version [插件版本]

plugman create --name testPluginDemo --plugin_id cordova-plugin-testPlugin --plugin_version 1.0.0

3.添加平台，这里只添加安卓了

plugman platform add --platform_name android

添加完在src目录下生成了android文件夹和.java 文件

 

并在plugin.xml文件中添加如下内容：

 

4.修改plugin.xml，如下：

<?xml version='1.0' encoding='utf-8'?>
<plugin id="cordova-plugin-testPlugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
    <name>testPluginDemo</name>
    <!-- js调用模块：src 为调用插件的js文件路径 -->
    <js-module name="testPluginDemo" src="www/testPluginDemo.js">
        <!-- target 为插件安装后的调用方法前缀，如：cordova.plugins.testPluginDemo.[插件方法名] -->
        <!-- <clobbers target="cordova.plugins.testPluginDemo" /> -->

        <!-- 可以自定义，调用时：testPluginDemo.[插件方法名] -->
        <clobbers target="testPluginDemo" />
    </js-module>
    <!-- android 环境配置项 -->
    <platform name="android">
        <!-- 插件配置 target为插件安装时，cordova项目android环境配置文件的位置 -->
        <!-- 插件安装时会将 config-file 标签中的内容添加到res/xml/config.xml 文件中 -->
        <config-file parent="/*" target="res/xml/config.xml">
            <!-- name 为对应 www/testPluginDemo.js文件中的调用名称 -->
            <feature name="testPluginDemo">
                <!-- value 为插件安装到项目中后 testPluginDemo.java文件路径，即：包路径 -->
                <!-- 此处修改一下，将其改为通用cordova插件的安装目录 -->
                <!-- 没改之前的： -->
                <!-- <param name="android-package" value="cordova-plugin-testPluginDemo.testPluginDemo" /> -->
                <param name="android-package" value="org.apache.cordova.testPluginDemo.testPluginDemo" />
            </feature>
        </config-file>
        <config-file parent="/*" target="AndroidManifest.xml"></config-file>
        <!-- src 为插件目录中java源文件路径，target-dir为插件安装到项目中后源文件路径 -->
        <!-- 此处将target-dir修改为与包路径一致 -->
        <source-file src="src/android/testPluginDemo.java" target-dir="src/org/apache/cordova/testPluginDemo" />
    </platform>
</plugin>

5.修改testPluginDemo.js

var exec = require('cordova/exec');


//exports.showToast 的showToast为插件安装后 js调用的方法名，其中传递的参数可以为任意多个
exports.showToast = function (arg0, success, error) {
    // success error 为成功回调   失败回调
    // testPluginDemo 为 plugin.xml中配置的feature的name名
    // 参数中的"showToast"  给testPluginDemo.java 判断的action参数


    //[arg0]   参数是一个
    //arg0 参数是多个 传参这样传过来["a",1]
    //[] 无参数

    exec(success, error, 'testPluginDemo', 'showToast', [arg0]);
};

6.修改testPluginDemo.java(package org.apache.cordova.testPluginDemo;包路径必须要填写，不填写会导致插件不能使用，之前就一直不好用，最后是这里的问题。写了包路径，插件项目可能会报错，但是插件可以正常使用)

//注意：包名必须写，不写不能正常调用
package org.apache.cordova.testPluginDemo;

import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import android.widget.Toast;
/**
 * This class echoes a string called from JavaScript.
 */
public class testPluginDemo extends CordovaPlugin {

    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if (action.equals("showToast")) {
            String message = args.getString(0);
            this.showToast(message, callbackContext);
            return true;
        }
        return false;
    }

    private void showToast(String message, CallbackContext callbackContext) {
        if (message != null && message.length() > 0) {
            Toast.makeText(cordova.getContext(),message,Toast.LENGTH_SHORT).show();
            callbackContext.success(message);
        } else {
            callbackContext.error("message无内容或解析错误");
        }
    }
}

 7.初始化插件

npm init

新建cordova项目准备测试：

1.创建cordova项目：

cordova create testPluginCordova

2. 添加安卓平台

cordova platform add android

3.添加插件testPluginDemo

cordova plugin add 插件目录

添加成功项目目录如下：

 在index.html中添加按钮并将unsafe-eval改为unsafe-inline，点击按钮调用插件，弹出toast。

在index.js调用插件：

 

运行项目：

cordova run android

运行结果: 弹出toast成功

 

 

附：插件在ionic项目中调用 

1.ionic项目中添加插件

ionic cordova plugin add 插件路径

2.代码调用

参考资料：https://www.cnblogs.com/VoiceOfDreams/p/11073447.html