上一张已经把环境搭好了,但是如何才能使用Cordova实现H5和IOS原生代码的交互呢,这就需要使用Cordova的插件了
至于Cordova的原理讲解,大家可以查看 http://www.cocoachina.com/industry/20130520/6238.html 和http://www.cocoachina.com/industry/20140623/8919.html 这是个人感觉原理讲的比较清楚地文章,但是其中的js代码不是特别清楚(楼主js只能看懂特别特别简单的代码~-~)
先写OC端的代码--
在Plugins上创建了一个类,ChenXJ.h ChenXJ.m
//集成自CDVPlugin
@interface ChenXJ : CDVPlugin
//前面的showMessage不重要,重要的是(CDVInvokedUrlCommand *)command--
-(void)showMessage:(CDVInvokedUrlCommand *)command;
@end
.m的文件
#import "ChenXJ.h"
@implementation ChenXJ
-(void)showMessage:(CDVInvokedUrlCommand *)command{
NSLog(@"%@------%@-------------------->%@",command.className,command.methodName,command.arguments);
//与js交互的数据 其中第一个参数是枚举
/*
typedef enum {
CDVCommandStatus_NO_RESULT = 0,
CDVCommandStatus_OK,
CDVCommandStatus_CLASS_NOT_FOUND_EXCEPTION,
CDVCommandStatus_ILLEGAL_ACCESS_EXCEPTION,
CDVCommandStatus_INSTANTIATION_EXCEPTION,
CDVCommandStatus_MALFORMED_URL_EXCEPTION,
CDVCommandStatus_IO_EXCEPTION,
CDVCommandStatus_INVALID_ACTION,
CDVCommandStatus_JSON_EXCEPTION,
CDVCommandStatus_ERROR
} CDVCommandStatus;
*/
//第二个参数是类型,可以使string,可以是NSArray
/*
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsString:(NSString*)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsArray:(NSArray*)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsInt:(int)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsNSInteger:(NSInteger)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsNSUInteger:(NSUInteger)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsDouble:(double)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsBool:(BOOL)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsDictionary:(NSDictionary*)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsArrayBuffer:(NSData*)theMessage;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageAsMultipart:(NSArray*)theMessages;
+ (CDVPluginResult*)resultWithStatus:(CDVCommandStatus)statusOrdinal messageToErrorObject:(int)errorCode;
*/
CDVPluginResult * pulginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString:@"4567"];
//这局代码这里可以忽略
[[NSNotificationCenter defaultCenter] postNotificationName:@"c" object:nil];
//其中command这个对象有许多属性
/*
@property (nonatomic, readonly) NSArray* arguments;//数过来的参数可以
@property (nonatomic, readonly) NSString* callbackId;//这个command的Id用作标记的
@property (nonatomic, readonly) NSString* className;//类名 ChenXJ
@property (nonatomic, readonly) NSString* methodName;//方法 showMessage (不要“:”的)
*/
[self.commandDelegate sendPluginResult:pulginResult callbackId:command.callbackId];
}
@end
到此OC代码完毕
---->
打开Staging文件夹下的config.xml文件在</widget>之前添加
<!--添加的-->
<feature name="ChenXJ">
<param name="ios-package" value="ChenXJ" />
</feature>
</widget>
到时插件创建完毕,可以“简单”地使用了
下面开始在H5的界面中传入参数与刚刚创建的OC代码形成交互
上面忘了说了,在Staging/www 下的index.html是这个app创建完毕后执行的h5代码,你可以通过config.xml中的
<content src="index.html" />
和OC中在CDVViewController.m下的
self.startPage = @"index.html";
来修改初始化时候加载的html文件
Come On
在你要加载的html文件中加入代码
<script src="cordova.js"></script>
用来确保cordova.js中的代码可以正常执行
比如我们在H5中创建了一个Button
<input οnclick="login()" type="button" id="login-login" class="input-size" value="登陆"></input>
点击登陆时会触发下面的方法
//点击登录触发方法----------------------------------------------->
function login(){
cordova.exec(success,error,"ChenXJ","showMessage",["123"]);
}
function success(message){
alert(message);
//window.location.href("new_quhao.html");
}
function error(){
alert("error");
}
代码分析
cordova.exec(success,error,"ChenXJ","showMessage",["123"]);
error是失败绑定的回调方法
ChenXJ 是native(OC)上的类名
showMessage 上ChenXJ类中的方法
["123"],是一个传给OC中的参数 (我之传了一个“123”字符串)
与oc中的打印的三个数据是对应的:类名,方法名,参数数组
command.className,command.methodName,command.arguments
运行代码可以看到,当加载完index.html文件后,点击了"登陆"按钮
xcode的控制台会打印
ChenXJ------showMessage-------------------->(
123
)
而h5界面会弹出对话框
从而实现了数据的在h5和OC原生的交互