PhoneGap插件开发示例(iOS) 

重要提示：如果你同时使用phonegap(cordova)和sencha-touch,一定先引入phonegap的js文件，否则你开发的插件可能不被调用！




PhoneGap相关介绍：


​​PhoneGap官网​​


​​PhoneGap中国​​


PhoneGap插件开发的简单步骤：


1 新建一个基于PhoneGap的工程，如果还没有PhoneGap SDK请去官网下载安装，我目前使用的是PhoneGap1.3.0


2 在Plugins组下新建一个PGPlugin类的子类，命名为MyPGPlugin


MyPGPlugin.h


复制代码 


1.  #ifdef PHONEGAP_FRAMEWORK
2.  #import <PhoneGap/PGPlugin.h>
3.  #else
4.  #import "PGPlugin.h"
5.  #endif
6. 
7.  @interface MyPGPlugin : PGPlugin {
8.  }
9. 
10.  - (void)addStr:(NSMutableArray*)arguments withDict:(NSDictionary*)options;
11. 
12.  @end



MyPGPlugin.m


复制代码 


1.  #import "MyPGPlugin.h"
2. 
3.  @implementation MyPGPlugin
4. 
5.  - (void)addStr:(NSMutableArray*)arguments withDict:(NSDictionary*)options
6.  {
7.      NSLog(@"%@", arguments);
8.      NSString *callbackId = [arguments pop];
9.      NSString *result = [NSString stringWithFormat:@"%@%@", [arguments objectAtIndex:0], [arguments objectAtIndex:1]];
10.      PluginResult *pr = [PluginResult resultWithStatus:PGCommandStatus_OK messageAsString:result];
11.      [self writeJavascript:[pr toSuccessCallbackString:callbackId]];
12.  }
13. 
14.  @end


3 在www文件夹下新建一个js文件，这里我也命名为MyPGPlugin


复制代码 


1.  /**
2.  * 构造方法
3.  */
4.  function MyPGPlugin() {
5.  };
6. 
7.  /**
8.  * 字符串相加
9.  *
10.  * @param str1, str2
11.  */
12.  MyPGPlugin.prototype.addStr = function(successCallback, failureCallback, str1, str2) {
13.      PhoneGap.exec(successCallback, failureCallback, "MyPGPlugin", "addStr", [str1, str2]);
14.  };
15. 
16.  /**
17.  * 加载MyPlugin对象
18.  */
19.  PhoneGap.addConstructor(function() {
20.      if(!window.plugins)
21.      {
22.      window.plugins = {};
23.      }
24.      window.plugins.myPGPlugin = new MyPGPlugin();
25.  });


4 修改PhoneGap.plist，展开Plugins，按”+”号新加一列.添加key MyPGPlugin和value MyPGPlugin


5 使用，在index.html中添加如下代码:


导入js文件


复制代码 


1.  <script type="text/javascript" charset="utf-8" src="MyPGPlugin.js"></script>


定义js函数，添加在onDeviceReady函数定义后


复制代码 


1.          function addStr(){
2.          var str1 = "str1";
3.          var str2 = "str2";
4.          window.plugins.myPGPlugin.addStr(successCallback, failureCallback, str1, str2);
5.      }
6.      //成功时回调的方法
7.      function successCallback(data){
8.          alert("result:"+ data);
9.      }
10.      //失败时返回的方法  
11.      function failureCallback(data){
12.          alert("error:"+ data);
13.      }


添加一个button，测试一下


复制代码 


1.  <button type="button" οnclick='addStr()'>MyPGPlugin Test</button>


6 编译运行。



参考链接：


​​http://www.adobe.com/devnet/html5/articles/extending-phonegap-with-native-plugins-for-ios.html​​


​​http://prostorys.blog.51cto.com/1522778/843699​​


​​http://wiki.phonegap.com/w/page/36753496/How%20to%20Create%20a%20PhoneGap%20Plugin%20for%20iOS​​


iOS系统的Javascript与Objective-C互操作指南

编写目的：本文重点阐述在iOS系统上通用的本地Objective-C代码与基于Javascript的Web的应用的互操作的基本方法，并通过具体范例说明两种代码的交互方式；

阅读前提：熟悉iOS系统的UIWebView的功能、调用方法，相应的UIWebViewDelegate委托的使用方法，并了解Javascript函数的基本语法与函数调用方法；

说明：正文部分红色字体表示Javascript代码，蓝色字体部分表示Objectvie-C代码(没办法贴格式了，将就看吧：（)；​

正文：

1.       Objective-C调用Javascript方法：

前提：

UIWebView已经完全加载完成包含需要调用的页面（注：在UIWebViewDelegate托管中通过监视- (void)webViewDidFinishLoad:(UIWebView *)webView调用来确定页面是否加载完成）。

方法：

假设某视图对象的子视图属性self.webview加载的页面包含如下Javascript函数：

function getString(){ return “Hello javascript!”;}

并且该函数在该页面上可被正常调用，则可以通过形如下面的Objectvie-C方法调用此函数：

NSString *str = [self.webview stringByEvaluatingJavaScriptFromString:@"getString();"];

该函数调用实际模拟了页面上的一次Javascript函数调用，因此在该函数内部任何有效的Javascript代码都可被执行！该Objective-C代码返回值为被调用的Javascript代码的返回值，在上例中，str的值将被赋为@”Hello javascript!”。

被调用的函数可以带有字符串或数值型的参数。若调用的Javascript函数名称带有参数，需保证传进去的参数的格式正确性，特别是字符串参数的引号很容易被忽略。

2.       系统响应页面Javascript代码：

前提：

       需要实现UIWebViewDelegate的

- (BOOL)webView:(UIWebView *)webView

shouldStartLoadWithRequest:(NSURLRequest *)request

navigationType:(UIWebViewNavigationType)navigationType;

托管函数（以下简称跳转监视函数）并将实现了该托管函数的对象设置为UIWebView的delegate。

方法：

       UIWebView的当前页面将要被Javascript代码通过以下方式转向的时候，会调用上述跳转监视函数：

       window.location.href=”http://www.st.net”;

此时实现了该托管协议的对象的跳转监视函数会被调用，通过如下代码监视浏览器跳转的地址：

       NSString *url = [[request URL] absoluteString];

若该托管函数返回值为NO，则页面UIWebView的页面跳转将被否决。利用这一思路，监视页面上的特定格式的跳转地址加以拦截，并执行相应的本地代码，即可实现Javascript与Objective-C代码的交互。

       例如，规定拦截URL地址前缀为”objc:”的所有地址，并且用if…else…语句判定本地需要执行的代码，则实现形如以下格式的Objective-C托管函数：

- (BOOL)webView:(UIWebView *)webView
shouldStartLoadWithRequest:(NSURLRequest *)request
navigationType:(UIWebViewNavigationType)navigationType
{
NSString *urlString = [[request URL] absoluteString];
       NSArray *urlComps = [urlString componentsSeparatedByString:@":"];
       if([urlComps count] && [[urlComps objectAtIndex:o] isEqualToString:@"objc"])
       {
              NSString *funcStr = [urlComps objectAtIndex:1];
              if([funcStr isEqualToString:@"doFunc1"])
              {
                     /*调用本地函数1*/
              }
              else if([funcStr isEqualToString:@"doFunc2"])
              {
                     /*调用本地函数2*/
              }
              return NO;
       }
       return YES;
}

当需要调用本地函数1时，可以通过如下Javascript函数进行：

       window.location.href=”objc:doFunc1”;

根据上述思路，可以完善通过Javascript调用本地带参数的Objective-C代码。


注意：后期我们将把UIWEBVIEW与WEBKIT的控件全部去掉，通过JS ENGINE的方式来代替WEB的开发方式，敬请关注后续文档SpiderMonkey 的 JSB动态绑定技术;