phoneGap插件

转载 2012年03月22日 15:06:07
快过年回家了,为了不阉割phonegap开发的介绍,在今天完成phonegap的最后一个介绍,在上一篇中提到过的如何开发phonegap的插件。
   目前PhoneGap虽然提供了很多的API,但是我们也很容易发现,他有很多地方不能满足我们的需求,比如发短信。我也将介绍如何开发一个针对PhoneGap发短信的Plugin。(Android 版本)。
1、创建一个Android工程,创建之后的目录结构如图:


2、把PhoneGap的android版jar包、javascript和xml文件夹加入工程。(参照上一篇中的做法)目录结构:


3、新增一个类MessagePlugin
这个类就是负责发送短信功能的具体类,可以调用发送短信的android API,当然如果是其他功能,则调用相应的API,但是当使用这个API时记得申请权限。
具体代码:
Java代码 复制代码 收藏代码
  1. package com.phonegap.kiddyu.plugin; 
  2.  
  3. import org.json.JSONArray; 
  4. import org.json.JSONException; 
  5. import org.json.JSONObject; 
  6.  
  7. import android.telephony.SmsManager; 
  8.  
  9. import com.phonegap.api.Plugin; 
  10. import com.phonegap.api.PluginResult; 
  11.  
  12. public class MessagePlugin extends Plugin { 
  13.      
  14.     private static final String SEND = "send"
  15.      
  16.     @Override 
  17.     public PluginResult execute(String action, JSONArray data, String callbackId) { 
  18.         PluginResult result; 
  19.         if (SEND.equals(action)) { 
  20.             try
  21.                 JSONObject jsonObj = new JSONObject(); 
  22.                 String target = data.getString(0); 
  23.                 String content = data.getString(1); 
  24.                 SmsManager sms = SmsManager.getDefault(); 
  25.                 sms.sendTextMessage(target, null, content, null, null); 
  26.                 jsonObj.put("target", target); 
  27.                 jsonObj.put("content", content); 
  28.                 result = new PluginResult(PluginResult.Status.OK, jsonObj); 
  29.             } catch (JSONException ex) { 
  30.                 result = new PluginResult(PluginResult.Status.JSON_EXCEPTION); 
  31.             }catch(IllegalArgumentException ex){ 
  32.                 result = new PluginResult(PluginResult.Status.ERROR); 
  33.             } 
  34.         } else
  35.             result = new PluginResult(PluginResult.Status.INVALID_ACTION); 
  36.         } 
  37.  
  38.         return result; 
  39.     } 
  40.  


4、为phonegap增加一个javascript的API
在工程目录www/js下面增加一个javascript文件:phonegapPlugin.js,然后加入代码:
Javascript代码 复制代码 收藏代码
  1. var Message = function(){}; 
  2.  
  3. Message.prototype = { 
  4.         send: function(success, error, target, content){ 
  5.             PhoneGap.exec(success, error, "MessagePlugin", "send", [target, content]); 
  6.         } 
  7. }; 
  8.  
  9. PhoneGap.addConstructor(function() { 
  10.     PhoneGap.addPlugin("message", new Message()); 
  11. }); 


关键的方法是PhoneGap.exec(success, error, "MessagePlugin", "send", [target, content]);
做一下简单的介绍:
success:方法执行成功时调用该函数;
error:方法执行失败时调用该函数;
"MessagePlugin":类名,最好与前面创建的Java类一个样;
"send":插件类中的参数String action;
[target, content]:一个数据,插件类中的参数JSONObject data;

PhoneGap.addPlugin("message", new Message());中的"Message"是你调用send方法时的实例名称。(不知道这样叫是否准确)


5、将自己的插件加入到PhoneGap的配置中
打开目录中res/xml/plugins.xml文件,在最后面加上
<plugin name="MessagePlugin" value="com.phonegap.kiddyu.plugin.MessagePlugin"/>
注意name要和你的插件类名一致! value是类的包名.类名。

插件到这里就算完成了,让我们测试一下到底能不能工作吧。
加入一个简单的html页面(上一篇已经介绍怎么开发,这里不做重复介绍),代码参照下面:
Html代码 复制代码 收藏代码
  1. <!DOCTYPE html> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  5. <script type="text/javascript" charset="utf-8" src="../js/jquery_1_6_4.js"></script> 
  6. <script type="text/javascript" charset="utf-8" src="../js/phonegap-1.2.0.js"></script> 
  7. <script type="text/javascript" charset="utf-8" src="../js/phonegapPlugin.js"></script> 
  8. <script type="text/javascript"> 
  9.     $(function(){ 
  10.         var onSend = function(){ 
  11.              
  12.             var success = function(data){ 
  13.                 alert("tel : " + data.target + ', and content : ' + data.content); 
  14.             }; 
  15.              
  16.             var error = function(e){ 
  17.                 alert(e); 
  18.             }; 
  19.              
  20.             var tel = $('#tel').val(); 
  21.             var content = $('#content').val(); 
  22.             window.plugins.message.send(success, error, tel, content); 
  23.         }; 
  24.          
  25.         $('#send').bind('click', onSend); 
  26.     }); 
  27. </script> 
  28. </head> 
  29. <body> 
  30.     <div id="messageDiv"> 
  31.         <input type="tel" id="tel" value="5556" /> 
  32.         <textarea rows="20" cols="25" id="content"></textarea> 
  33.         <button type="button" id="send">Send Me</button> 
  34.     </div> 
  35. </body> 
  36. </html> 


注意在页面中加入你自己的phonegapPlugin.js,而且顺序必须在phonegap.js之后。
其他的都参照上一篇中,修改自己的Activity就开始测试吧!一下是测试截图:



HTML5与Phonegap框架初步

这个主题就是HTML5的PhoneGap小框架,由第三方公司来开发与设计。值得学习的是他如何把它融入到Android的UI框架哩,然后跟WebView搭配得非常的紧密,来共同支持HTML5。也就是支持Web App的开发及执行。如果您想开发自己的小框架,而且想把它融入到Android的大框架里,那么这个PhoneGap框架的设计,就是您很好的学习模板啰。
  • 2015年09月19日 14:13

android phonegap插件开发方法 plugin

此篇文章以cordova 3.4版本编写 phonegap的javascript调用android的Activity功能,以及相互传递数据. 本节讲的是 自主编写 phonegap插件提供下载 据我...
  • aaawqqq
  • aaawqqq
  • 2014-03-03 22:41:19
  • 31199

phonegap(cordova) 自定义插件代码篇(二)----android 自动更新

程序总要更新的,apple 等appstore 处理,cordova 自动更新,上代码 /** * 检查并更新APP */ (function (cordova) { var defi...
  • zlj002
  • zlj002
  • 2015-12-31 17:22:55
  • 2666

phonegap插件的实现

需求:通过手机web端,点击指定按钮能够调用Android手机内部的某个应用程序,以QQ为例。 分析:phonegap可以实现用web API调用手机的本地功能,如二维码扫描,拍照等。官网已有一些现...
  • happyflyingave
  • happyflyingave
  • 2014-05-07 10:26:55
  • 3137

<em>phonegap</em> <em>local</em>

<em>phonegap</em> <em>local</em>-notifications插件应用实例含(android、ios、windows) ...cordova插件之<em>Local</em> Notification(本地通知) cordova-<em>plugin</em>-<em>local</em>-notifications发送...
  • 2018年04月22日 00:00

phoneGap插件

快过年回家了,为了不阉割phonegap开发的介绍,在今天完成phonegap的最后一个介绍,在上一篇中提到过的如何开发phonegap的插件。    目前PhoneGap虽然提供了很多的API,但...
  • Avenleft
  • Avenleft
  • 2012-03-22 15:06:07
  • 14510

cordova-plugin-app-version插件的使用

开发项目的时候自动更新功能呢,需要获取app的版本,cordova-plugin-app-version可以用来的获取版本号,可以用命令行:cordova plugin add cordova-plu...
  • Jiaen188
  • Jiaen188
  • 2017-08-01 22:04:32
  • 721

phonegap开发app中踩过的那些坑

把遇到的问题列出来,如果有解决方案的,偶也会写下来,如果大家有更好解决方法的,欢迎留言噢   phonegap 2.9无法触发deviceready事件 亲们可以看下控制台有...
  • xiebaochun
  • xiebaochun
  • 2014-07-08 23:21:58
  • 5379

Ionic 跨平台开发之Cordova插件清单及使用说明

一,插件相关常用命令1,查看所有已经安装的插件     cordova plugin ls2,安装插件(以camera插件为例)     cordova plugin add cordova-plug...
  • ZhangKui0418
  • ZhangKui0418
  • 2018-02-24 17:35:41
  • 105

PhoneGap 插件简介

一、PhoneGap平台 前不久PhoneGap发布了1.0版本,这为移动开发大家族提供了又一个跨平台的解决方案。开发者只要有JavaScript、CSS3、Html5的基础就可以快速开发移动应用,并...
  • yyan
  • yyan
  • 2011-08-06 14:21:00
  • 8048
收藏助手
不良信息举报
您举报文章:phoneGap插件
举报原因:
原因补充:

(最多只允许输入30个字)