前言
本文適合Android+web的復合型人才，由於cordova本身就是混合開發，所以在Android開發的基礎上，還要懂web相關技術(HTML+CSS+JS)。可是也有例外，比方我。僅僅需負責Android方面。web方面的交由其它web組人員開發。盡管。web略懂一點。但我主要還是搞Android開發的。
編寫自己定義插件類
本節的內容是。自己定義一個dialog插件。供web調用，顯示系統彈窗。
新建一個包名，我這里使用org.apache.cordova.dialog。然后創建個類CustomDialog.java。繼承於CordovaPlugin（全部自己定義插件，都要繼承CordovaPlugin），最后重寫execute方法。
execute有三個重載方法：
public boolean execute(String action, JSONArray args, CallbackContext callbackContext)public boolean execute(String action, CordovaArgs args, CallbackContext callbackContext)public boolean execute(String action, String rawArgs, CallbackContext callbackContext)這三個方法。假設你看了CordovaPlugin源代碼的話。會發現，事實上最后都調用了第二個方法，可是CordovaArgs僅僅是對JSONArray的一個封裝。方便操作json數據而已，所以要重寫哪個。按個人喜好。
這里。我是重寫了第二個方法，如今來說明下方法參數：
String action：一個類里面能夠提供多個功能，action就是指名了要調用哪個功能。
CordovaArgs args：web以json的數據格式傳遞給Android native。CordovaArgs 是對JSONArray 的一個封裝。
CallbackContext callbackContext：這個是回調給web，有success和error兩種回調方法。
詳細實現例如以下：
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();
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);
}
}假設web使用了CustomDialog插件。並調用show方法（action）。這時候，會彈出一個系統窗體。會顯示web傳過來的消息內容，點擊確定，回調web，告訴它調用成功，取消則是失敗。最后記得return true（表示調用成功）。
配置config.xml
打開res/xml/config.xml文件，原本內容例如以下：
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.example.helloworld" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<preference name="loglevel" value="DEBUG" />
<feature name="Whitelist">
<param name="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin" />
<param name="onload" value="true" />
</feature>
<allow-intent href="market:*" />
<name>HelloWorld</name>
<description>
A sample Apache Cordova application that responds to the deviceready event.
</description>
<author email="dev@cordova.apache.org" href="http://cordova.io">
Apache Cordova Team
</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
</widget>Whitelist是基礎項目自帶的一個插件，相同的，我們在widget節點下也加入一個feature。
<?xml version='1.0' encoding='utf-8'?> <widget id="com.example.helloworld" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> <preference name="loglevel" value="DEBUG" /> <feature name="Whitelist"> <param name="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin" /> <param name="onload" value="true" /> </feature> <!--彈窗插件--> <feature name="CustomDialog"> <param name="android-package" value="org.apache.cordova.dialog.CustomDialog" /> </feature> <allow-intent href="market:*" /> <name>HelloWorld</name> <description> A sample Apache Cordova application that responds to the deviceready event. </description> <author email="dev@cordova.apache.org" href="http://cordova.io"> Apache Cordova Team </author> <content src="index.html" /> <access origin="*" /> <allow-intent href="http://*/*" /> <allow-intent href="https://*/*" /> <allow-intent href="tel:*" /> <allow-intent href="sms:*" /> <allow-intent href="mailto:*" /> <allow-intent href="geo:*" /> </widget>
feature name能夠隨便取，param value填的是詳細類的位置。
web配置並調用
1、配置
打開asserts/www/cordova_plugins.js文件,注冊插件。
cordova.define('cordova/plugin_list', function(require, exports, module) {
module.exports = [
{
"file": "plugins/cordova-plugin-whitelist/whitelist.js",
"id": "cordova-plugin-whitelist.whitelist",
"runs": true
},
{
"file": "plugins/cordova-plugin-dialog/dialog.js",//js文件路徑
"id": "cordova-plugin-dialog.CustomDialog",//js cordova.define的id
"clobbers": [
"alertDialog"//js 調用時的方法名
]
}
];
module.exports.metadata =
// TOP OF METADATA
{
"cordova-plugin-whitelist": "1.2.1"
};
// BOTTOM OF METADATA
});然后在assets/www下創建dialog.js文件
內容例如以下：
cordova.define("cordova-plugin-dialog.CustomDialog",
function(require, exports, module) {
var exec = require("cordova/exec");
module.exports = {
show: function(content){
exec(
function(message){//成功回調function console.log(message);
},
function(message){//失敗回調function console.log(message);
},
"CustomDialog",//feature name
"show",//action
[content]//要傳遞的參數。json格式
);
}
}
});cordova.define 的第一個參數就是cordova_plugins.js里面定義的id，最基本的是exec方法，參數說明：
參數1：成功回調function
參數2：失敗回調function
參數3：feature name，與config.xml中注冊的一致
參數4：調用java類時的action
參數5：要傳遞的參數，json格式
2、調用
配置完上面的。僅僅剩下在合適的地方調用它了。
打開assets/www/js/index.js
找到onDeviceReady方法，然后調用
alertDialog.show('Hello World!!!!');這里直接調用alertDialog，就是在cordova_plugins.js下定義的clobbers名稱,show是在js申明的function
index.js#onDeviceReady
onDeviceReady: function() {
app.receivedEvent('deviceready');
//調用自己定義插件
alertDialog.show('Hello World!!!!');
}直接在Android Studio運行，效果圖例如以下：
這個對話框就是Android 系統的AlertDialog。
當我們點擊確定時。就會回調js success function，打印出日志。
不要運行cordova build命令。！
！
須要注意的是。假設你上一篇章有細致看過之后，你會有這么個疑問，編譯項目不是用
cordova build命令的嗎？非常好，網上非常多說。在項目中。代碼都已經寫好了。可是一運行該命令，不但沒有生效，反而之前寫的插件代碼都沒了。事實上，假設你知道整個項目編譯過程。那么問題就迎刃而解了。
這里簡單的說下。看下圖的目錄結構
plugins是存放插件的目錄。而www是存放H5項目的。也就是Android項目下的asserts/www下的文件，當運行cordova build時，它會依據config.xml配置來編譯項目，然后會將plugins和www下的文件應用到platforms目錄下的各個平台，這就是“一次編譯，多平台運行”。
可是。至始至終，我們編寫的代碼都是在Android平台下的。而上面提到的兩個目錄我們都沒有動過。也就是說，全部配置都沒有動過。都是初始狀態，所以運行build后也就沒有效果。
總結
通過上面的實例，已經實現了簡單的自己定義插件，可是它僅僅是在Android平台上實現的。那么。我們怎么應用在其它的平台上呢？或者說，我們實現一個插件之后，怎么提供給別人項目使用呢？下一節，將說說插件安裝包怎樣生成。就是解決這幾個問題的。