Cordova 自定义插件 以及 使用

一、创建插件

1.创建插件：找一个适合的文件路径，执行cmd，输入以下命令：

plugman create --name ToastPlugin --plugin_id com.example.toast --plugin_version 1.0.0
           

1. ToastPlugin 表示 插件的名称
2. com.example.toast 插件id

3. 1.0.0 版本

   创建成功

2.使用Android studio 打开插件，在

src

目录下新建

android

目录，然后将写好的java代码copy到android目录下，注意：一定要继承

CordovaPlugin

类，实现

execute

方法，完整代码

package com.example.hello;
import android.app.AlertDialog;
import android.content.DialogInterface;

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;

public class ToastPlugin extends CordovaPlugin {

    @Override
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
        if ("showToast".equals(action)) {
            AlertDialog.Builder builder = new AlertDialog.Builder(cordova.getActivity());
            builder.setTitle("提示");
            builder.setMessage(args.getString(0));
            builder.setPositiveButton("确定", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
                    callbackContext.success("点击了确定");
                }
            });
            builder.setNegativeButton("取消", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
                    callbackContext.error("点击了取消");
                }
            });
            builder.create().show();
            return true;
        }
        return super.execute(action, args, callbackContext);

    }

    public void showToast( CallbackContext callbackContext){
        Toast.makeText(cordova.getActivity(), "点击了我", Toast.LENGTH_SHORT).show();
        callbackContext.success("点击成功回调");
    }
}

           

3.修改

plugin.xml

添加android platform ，如下

<!--添加Android平台  -->
    <platform name="android">
        <config-file parent="/*" target="res/xml/config.xml">
            <!-- JS调用时的名字 -->
            <feature name="ToastPlugin">
                <!-- value：ToastPlugin.java存放的路径 -->
                <param name="android-package" value="com.example.hello.ToastPlugin" />
            </feature>
        </config-file>
        <config-file parent="/*" target="AndroidManifest.xml">
            <!-- 权限，此处为示例 -->
            <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
            <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
        </config-file>
        <!-- src:是插件里存放对应.java的路径， target-dir:安装插件时把.java文件存放的位置，要和上面的value路径对应 -->
        <source-file src="src/android/ToastPlugin.java" target-dir="src/com/example/hello" />
    </platform>
           

4.

修改ToastPlugin.js

，添加

showToast

方法，如下：

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

exports.coolMethod = function (arg0, success, error) {
    exec(success, error, 'ToastPlugin', 'coolMethod', [arg0]);
};
// ToastShow： 是plugin.xml文件中的feature标签 name属性
// show：是js中调用的方法名
// [arg0]: 表示一个参数，[arg0,arg1]:表示两个参数
exports.showToast = function(arg0, success, error){
    exec(success,error,'ToastPlugin','showToast',[arg0])
};
           

5.初始化插件，在插件的根目录下，执行

npm init

,然后一路

Enter

创建成功

二、插件的使用

1.添加插件

// E:\cordova\ToastPlugin为本地插件路径
cordova plugin add E:\cordova\ToastPlugin
           

2.修改

index.html

增加点击事件

<p id="toast">点我提示Toast</p>
           

3.修改

index.js

,增加JS点击事件处理

document.getElementById('toast').onclick = function(){
 cordova.plugins.ToastPlugin.showToast();
}

           

大功告成