之前寫過一篇PhoneGap中Plugin用法的博客,http://www.cnblogs.com/wuwangSaber/archive/2012/05/28/2521321.html
不過當時用的是cordova-1.7.0這個版本,而在cordova-1.7.0.js中也明確指出addPlugin方法將在2.0版本中被移除,以下為源碼
// TODO: remove in 2.0. addPlugin: function(name, obj) { console.log("[DEPRECATION NOTICE] window.addPlugin and window.plugins will be removed in version 2.0."); if (!window.plugins[name]) { window.plugins[name] = obj; } else { console.log("Error: Plugin "+name+" already exists."); } },
所以在Cordova2.0版本中Plugin的用法有些變化,接下來介紹一下Cordova2.0中Plugin的用法。
實現功能還是和之前博客一樣,JS調用Java代碼並傳參,Java代碼進行處理並返回成功回調JS代碼。
1.Java代碼(這一步沒有變化)
一個繼承自Plugin的類,並實現execute方法。
public class test01 extends Plugin{ public static final String ACTION = "test"; @Override public PluginResult execute(String action, JSONArray data, String callbackId) { // TODO Auto-generated method stub PluginResult result = null; JSONObject jsonObj = new JSONObject(); if(ACTION.equals(action)){ try { String testData1 = data.getString(0); String testData2 = data.getString(1); Log.e("test!!!", "This is testData1 " + testData1); Log.e("test!!!", "This is testData2 " + testData2); jsonObj.put("testData1", testData1 + " after Plugin"); jsonObj.put("testData2", testData2 + " after Plugin"); result = new PluginResult(PluginResult.Status.OK, jsonObj); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } } return result; } }
2.在xml中注冊
由於Cordova2.0中將之前的cordova.xml和plugins.xml合並成了一個新的配置文件config.xml,所以只用將這一個xml文件拷貝到項目res/xml下並加入Plugin的注冊
<plugin name="test01" value="包名.test01"/>
name指的是他的別名(貌似必須與類名相同),value是他真正的類名
3.js編寫插件
新建一個plugin.js,內容如下:
if (typeof cordova !== "undefined") { function testPlugin() { this._callback; } testPlugin.prototype.test = function(testData1, testData2, cb) {//插件的test方法 this._callback = cb; return cordova.exec(cb, null, 'test01', "test", [testData1, testData2]);
//exec的參數依次是 回調函數, 執行失敗的回調函數, xml中注冊的插件名, 插件中用於判斷的Action名, 參數 }; cordova.addConstructor(function() { if (!window.plugins) { window.plugins = {}; } window.plugins.testPlugin = new testPlugin(); //addPlugin方法取消后用這種方式創建插件 }); };
4.HTML代碼中調用JS並測試
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>test</title> <script type="text/javascript" src="cordova-2.0.0.js"></script> <script type="text/javascript" src="plugin.js"></script> <script type="text/javascript">
var test01 = function(){ var cb = function(data){ //回調函數 alert("1111111 : " + data.testData1 + ' and 2222222 : ' + data.testData2); }; window.plugins.testPlugin.test("first test data", "second test data", cb); } </script> </head> <body> <button type="button" onclick="test01()">Click Me!</button> </body> </html>
代碼已上傳至gitHub,地址是 https://github.com/seeSaber/pluginTest 歡迎拍磚^_^