phonegap自定义插件笔记

最新推荐文章于 2021-06-16 10:34:08 发布

原创最新推荐文章于 2021-06-16 10:34:08 发布 · 892 阅读

0 ·

CC 4.0 BY-SA版权

phonegap 提供了一系列插件，封装好了native的功能，可以在js层面调用，访问native的功能，但是，当这些插件不能满足需求的时候，就需要自己封装插件了。

过程很简单

1 .写类继承 Plugin类

覆盖其中execute方法。

例如

MessagePlugin 继承Plugin类，实现发短信操作。

@Override
	public PluginResult execute(String action, JSONArray data, String callbackId) {
		PluginResult result;
		if (SEND.equals(action)) {
			try {
				JSONObject jsonObj = new JSONObject();
				String target = data.getString(0);
				String content = data.getString(1);
				SmsManager sms = SmsManager.getDefault();
				sms.sendTextMessage(target, null, content, null, null);
				jsonObj.put("target", target);
				jsonObj.put("content", content);
				result = new PluginResult(PluginResult.Status.OK, jsonObj);
			} catch (JSONException ex) {
				result = new PluginResult(PluginResult.Status.JSON_EXCEPTION);
			} catch (IllegalArgumentException ex) {
				result = new PluginResult(PluginResult.Status.ERROR);
			}
		} else {
			result = new PluginResult(PluginResult.Status.INVALID_ACTION);
		}

		return result;
	}

2.在res/xml/plugins.xml文件中，声明插件类. 实际上是插件名和对应java文件的映射.

3 .在assert/www/js/文件夹下，增加对应此plugin的 js文件。

var Message = function(){};

Message.prototype = {
		send: function(success, error, target, content){
			PhoneGap.exec(success, error, "MessagePlugin", "send", [target, content]);
		}
};

PhoneGap.addConstructor(function() {
	PhoneGap.addPlugin("message", new Message());
});

新建了名为message的插件，对外提供send方法。实际上当调用message插件send方法时候，会调用MessagePlugin类。success和error分别为调用成功和失败的回掉函数名称.PhoneGap.exec(success, error, "MessagePlugin", "send", [target, content]);

4.使用刚刚写好的插件例子

注意将phonegapPlugin.js写到声明里面。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" charset="utf-8" src="js/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="js/phonegap-1.2.0.js"></script>
<script type="text/javascript" charset="utf-8" src="js/phonegapPlugin.js"></script>
<script type="text/javascript">
	$(function(){
		var onSend = function(){
			
			var success = function(data){
				alert("tel : " + data.target + ', and content : ' + data.content);
			};
			
			var error = function(e){
				alert(e);
			};
			
			var tel = $('#tel').val();
			var content = $('#content').val();
			window.plugins.message.send(success, error, tel, content);
		};
		
		$('#send').bind('click', onSend);
	});
</script>
</head>
<body>
	<div id="messageDiv">
		<input type="tel" id="tel" value="5556" />
		<textarea rows="20" cols="25" id="content"></textarea>
		<button type="button" id="send">Send Me</button>
	</div>
</body>
</html>

运行。