cordova自定义插件
注意：存放自定义cordova插件目录不能有空格可能会报错
一 .cordova安装
1.下载node.js，安装完成后你可以在命令行中使用node和npm.
安装cordova使用node.js的npm工具。打开控制台输入：npm install -g cordova
二.安装plugman
cordova需要用plugman来创建自定义插件 命令：npm install -g plugman
三.用cordova创建android工程
1.创建cordova工程
现在电脑上新建一个cordova文件夹 ，在文件中执行命令: cordova creatr dialog com.jcy.android
文件夹中会多一个文件夹这就是你的cordova工程
dialog 是工程名 com.jcy.android 是cordova工程的包名
创建成功后的目录：
2.生成android工程
先进入到刚刚创建的cordova目录中，然后开始创建android工程。
命令:cordova platform add android
android --> 创建的平台名也可以是iOS等
下图是创建成功的情况，失败的原因有可能是android的环境没有配好。
生成android工程的目录
生成之后我们开始导入到android studio中：
第一步：选择打开本地已有的android工程。
第二步：找到刚刚创建好的android工程导入。
至此就已经把cordova插件开头的部分创建好了。
四.创建自定义插件
先在电脑上创建一个cordova插件的目录，然后跳转到该目录，开始创建cordova插件。
plugman create --name dialog-plugin --plugin_id dialog-plugin --plugin_version 1.0.0
--name dialog-plugin --> 插件名
--plugin_id dialog-plugin --> 插件ID
--plugin_version 1.0.0 --> 插件版本号
生成插件的目录如下
toast-plugin
。src
。android
。android的目录
。www
编写ToastDemo.java用于被调用
可以在刚刚创建的Android工程下面编写这个代码，具体代码如下：
execute方法是插件被调用时，会把操作和参数以及回调传递过来
代码：
package com.jcy.android;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.provider.MediaStore;
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaArgs;
import org.apache.cordova.CordovaPlugin;
import org.json.JSONException;
import static android.media.MediaRecorder.VideoSource.CAMERA;
public class CustomDialog extends CordovaPlugin {
@Override
public boolean execute(String action, CordovaArgs args, final CallbackContext callbackContext)throws JSONException {
if("show".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();
//Toast.makeText(cordova.getContext(),"点击了确定",Toast.LENGTH_SHORT).show();
openCamra();
callbackContext.success("点击了确定");
}
});
builder.setNegativeButton("取消", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
dialog.dismiss();
//Toast.makeText(cordova.getContext(),"点击了取消",Toast.LENGTH_SHORT).show();
callbackContext.error("点击了取消");
}
});
builder.create().show();
return true;
}
return super.execute(action, args, callbackContext);
}
private void openCamra(){
CordovaPlugin cordovaPlugin =null;
Intent camera =new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
cordova.startActivityForResult(cordovaPlugin,camera,CAMERA);
}
}
把这个文件复制到刚刚生成的插件目录下
编辑plugin.xml文件
修改plugin.xml,代码都有注释，如下：
<?xml version='1.0' encoding='utf-8'?>
<plugin id="dialog-plugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
<name>dialog-plugin</name>
<js-module name="dialog-plugin" src="www/dialog-plugin.js">
<clobbers target="CustomDialog" />
</js-module>
<!--添加Android平台 -->
<platform name="android">
<config-file target="res/xml/config.xml" parent="/*">
<!-- JS调用时的名字 -->
<feature name="CustomDialog">
<!-- value：的值是对应的插件中CustomDialog.java存放的路径 -->
<param name="android-package" value="com.jcy.android.CustomDialog"/>
</feature>
</config-file>
<!-- src:是插件里存放对应.java的路径， target-dir:安装插件时把.java文件存放的位置，要和上面的value路径对应 -->
<source-file src="src/android/CustomDialog.java" target-dir="src/com/jcy/android" />
</platform>
</plugin>
编辑www目录下的toast-plugin.js文件
修改为：
varexec =require('cordova/exec');
// ToastShow： 是plugin.xml文件中的feature标签 name属性
// show：是js中调用的方法名// [arg0]: 表示一个参数，[arg0,arg1]:表示两个参数
exports.show =function(arg0, success, error)
{
exec(success, error,'CustomDialog','show', [arg0]);
};
五.初始化插件
进入到插件目录，初始化插件 命令 npm init
效果图如下，输入信息时有括号的按照括号里面的输入，没有的可以跳过。
六.向项目中添加自定义插件
上面基本上就完成了一个简单的自定义插件的制作，接下来把插件添加到之前创建的Android工程中测试，制作是否成功。
添加的方法和上面一样，先进入到platforms目录下
然后输入 cordova plugin add D:\newDialog\dialog-plugin
D:\newDialog\dialog-plugin 新建插件的目录
添加成功
然后在Android studio中调用测试。调用方式通俗的讲就是dialog-plugin.js文件中的那两个参数。
先在 index.html 中加
<button id="dialog" style="font-size:24px">弹窗</button >
在index.js 调用
注意 :CustomDialog.show("参数"，"success","error");
1.suceess:成功回调
2.error:失败回调
3.顺序一定不能错！！！！
成功！
七.注意
1.命令最好用管理员运行
2.提示 Android target 和Gradle 未安装
缺少环境变量
新建 变量名：Android_Platform_Tools 变量值 ：Android sdk 目录下找到 platform-tools 全路径加进去
再将 Android_Platform_Tools 添加到Path中
完美解决！
基础内容大概就这些 大家有疑问可以在评论中问，看到了会回复，有错误也欢迎指出，共同学习。
