我的博客网站:http://www.zeromike.net
本文地址:http://www.zeromike.net/?p=58
在使用phonegap或者说叫cordova进行hybrid开发的时候,肯定需要和原生代码进行交互,因此需要开发一个插件来完成两者之间的交互,下面我给出示意性代码。将建好的cordova项目导入eclipse中,我下一篇会写如何建立cordova项目。
插件开发链接:http://docs.phonegap.com/en/3.5.0/guide_hybrid_plugins_index.md.html#Plugin%20Development%20Guide
Warning:中文文档千万别看,还是繁体,编程用词和大陆相差比较大,貌似是台湾翻译的吧,看了变SB了。。。
需求:在客户端点击一个按钮,将一个字符串信息传到原生代码并通过回调方法显示出来。
1.在src目录中建立插件类
package com.mike;
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaPlugin;
import org.json.JSONArray;
import org.json.JSONException;
public class MyPlugin extends CordovaPlugin {
@Override
public boolean execute(String action, JSONArray args,
CallbackContext callbackContext) throws JSONException {
if (action.equals("echo")) {
String message = args.getString(0);
this.echo(message, callbackContext);
return true;
}
return false;
}
private void echo(String message, CallbackContext callbackContext) {
if (message != null && message.length() > 0) {
callbackContext.success(message);
} else {
callbackContext.error("Expected one non-empty string argument.");
}
}
}
2.在res/confg.xml文件中加入
<feature name="App"> <param name="android-package" value="org.apache.cordova.App" /> </feature> <!-- 设备 --> <feature name="Device" > <param name="android-package" value="org.apache.cordova.device.Device" /> </feature> <!-- 添加自定义插件 --> <feature name="MyPlugin" > <param name="android-package" value="com.mike.MyPlugin"/> </feature>
3.在www/js/index.js文件中加入
var MyPlugin = function() { }; MyPlugin.prototype.service ='MyPlugin'; MyPlugin.prototype.exec = cordova.require('cordova/exec'); MyPlugin.prototype.sayHello = function(params,success) { this.exec(success, function(err) {success('Nothing to echo.');}, this.service, "echo", [params]); };
exec的执行方法参数介绍:
第一个参数 success:方法执行成功时调用该方法
第二个参数 方法执行失败时调用该函数,可自定义该方法
第三个参数 插件名称,保证和config.xml中的插件名称一致就行(feature的name)
第四个参数 插件类中的调用的方法名称
第五个参数 [target, content]:一个数据,插件类中的参数JSONObject data
4.在www/index.html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<meta name="msapplication-tap-highlight" content="no" />
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>Apache CordovaHelelloo</h1>
<div class="app">
<h1>Apache Cordova</h1>
<input type="button" value="test" οnclick="test();" />
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
var plugin = new MyPlugin();
function test(){
plugin.sayHello("zeromike", function(echoValue) {
alert("hello,"+echoValue);
});
}
</script>
</body>
</html>
点击后结果:hello,zeromike
原文链接:http://www.zeromike.net/?p=58
原文作者:zeromike