上次开发了属于自己的Android cordova 插件;
现在开发属于自己的iOS cordova 插件;
首先需要新建一些文件夹和文件,具体如图:
1.新建iOSalert 文件夹;在IOSalert 文件夹下新建src、www 文件夹和plugin.xml文件;
而在src文件夹下新建iOS文件夹,又在iOS文件夹下新建文件 Alert.h和Alert.m 文件;
而在www文件夹下新建文件alert.js;
最后的文件夹结构如上图;
2.首先在plugin.xml 的内容如下:
<?xml version="1.0" encoding="UTF-8"?> <plugin xmlns="http://apache.org/cordova/ns/plugins/1.0" id="com.mtel.debbie" version="0.0.1"> <name>alertPlugin</name> <description> Description</description> <js-module src="www/alert.js" name="alert"> <clobbers target="Alert" /> </js-module> <platform name="ios"> <config-file target="config.xml" parent="/*"> <feature name="Alert"> <param name="ios-package" value="Alert"/> </feature> </config-file> <header-file src="src/ios/Alert.h"/> <source-file src="src/ios/Alert.m" /> </platform> </plugin>
注:1. 其中js-module 里面的 -----》 src="www/alert.js" 是指刚刚新建www文件夹下的alert.js文件的路径;
-----》 clobbers 里面的target=“Alert” 这个Alert将用在:当调用alert.js里面导出的对象时,把它赋值给 Alert,这样的话 就可以调用alert.js里面的方法 如: Alert.showtest();
2.header-file 和source-file 里面的src 都是指向 刚刚新建的src/ios/下的文件Alert.h ,Alert.m 的路径;
3.src/ios/下的文件Alert.h ,Alert.m 的内容如下:
// // Alert.h // HelloCordova // // Created by Mtel on 14-12-25. // // //#import <Cordova/Cordova.h> //this is error import #import <Cordova/CDVPlugin.h> @interface Alert : CDVPlugin -(void) show:(CDVInvokedUrlCommand*)command; @end
// // Alert.m // HelloCordova // // Created by Mtel on 14-12-25. // // #import "Alert.h" @implementation Alert -(void) show:(CDVInvokedUrlCommand *)command { NSString *data = [command.arguments objectAtIndex:0];//这是我JavaScripte 传来的数据; BOOL arg = YES; CDVPluginResult* result;//定义:要向JavaScript 返回的结果; if (arg) { // Success Callback 成功 返回成功时的数据; result = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsString:@"我返回的数据"]; //显示一个alert 对话框 UIAlertView *alert=[[UIAlertView alloc] initWithTitle:@"this is title" message:data delegate:self cancelButtonTitle:@"cancel" otherButtonTitles:@"sure", nil]; [alert show];
//end alert 对话框;
//执行 向JavaScript 返回结果 //[self writeJavascript:[result toSuccessCallbackString:command.callbackId]];//version=3.6 [self.commandDelegate sendPluginResult:result callbackId:command.callbackId];//version =4.0 } else { // Error Callback result = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR messageAsString:@"error"]; [self.commandDelegate sendPluginResult:result callbackId:command.callbackId];//version =4.0 //[self writeJavascript:[result toErrorCallbackString:command.callbackId]]; } } @end
4.www文件夹下的alert.js 内容如下:
var AlertTest = function() {}; AlertTest.prototype.showtest = function(success, fail,message) { cordova.exec(success, fail, "Alert","show", [message]); }; var alerttest = new AlertTest(); module.exports = alerttest;
到这里,这个简单的插件就完成了;
添加到你的项目下:
5.调用你的插件:
< script > document.addEventListener("deviceready", onDeviceReady, false); function onDeviceReady() { Alert.showtest( function(result) { alert("success: " + result); }, function(error) { alert("error: " + error); }, "this is mydata" ); } < /script>
注:你在你的项目下platforms/ios/www/cordova_plugins.js中你会发现你添加的插件;
如上图 Alert 这样就可以调用 alert.js文件下被导出的方法了 如;Alert.showtest();
最后得到的结果是
弹出一个对话框: