- 搞了半个月Cordova插件,但一直没沉下心能弄。为了更好的理解Cordova插件的开发,今天自己写了一个Demo先简单介绍一下,如不清楚Cordova是什么,有什么作用,可以移步问度娘《hybrid应用开发,Cordova框架》。其实Cordova的实现原理还是基于webView截获URL(URL中包含类名和方法名以及参数),然后通过反射机制实现原生代码调用。好,先列举一下Custom Plugin的主要步骤和思路。1、安装Cordova环境。2、使用Cordova创建工程。3、打开IOS工程。 //核心步骤
- 4、编写OC原生代码插件类,需要继承自CDVPlugin父类。5、编写调用OC的JS层代码。6、编写顶级的Plugin.xml的插件配置文件。详细步骤说明。1、安装Cordova环境。这里就百度Cordova,上官网吧,步骤繁琐就不细说,比较简单。2、使用Cordova创建工程。Crodova create是命令,后面跟三参数。cordova create工程名 (TestPlugin)应用标识 (com.liki.TestPlugin)App名称Plugin3、打开IOS工程。工程路径在: 当前创建工程路径下的platforms文件夹中。4、编写OC原生代码插件类,需要继承自CDVPlugin父类5、将ios和Android原生的类文件拷贝相应目录。6、将写好的JS文件拷贝到www目录下 * *************我是分隔符 * **********************************CeshiPlugin.h文件#import < Cordova / CDV.h > @interface CeshiPlugin: CDVPlugin - (void) addstr: (CDVInvokedUrlCommand * ) command;@end * *************我是分隔符 * **********************************#import "CeshiPlugin.h"@implementation CeshiPlugin - (void) addstr: (CDVInvokedUrlCommand * ) command {
- //获取js传过来的值 CDVPluginResult *result=nil;
- NSString * ceshi1 = [command.arguments objectAtIndex: 0];
- NSString * ceshi2 = [command.arguments objectAtIndex: 1];
- NSString * ceshi3 = [command.arguments objectAtIndex: 2];
- if (ceshi1 != nil && [ceshi1 length] > 0 && [ceshi2 length] > 0 && ceshi2 != nil && ceshi3 != nil && [ceshi3 length] > 0) { //拼接字符串
- NSString * addResult = [NSString stringWithFormat: @"%@%@%@", ceshi1, ceshi2, ceshi3];
- result = [CDVPluginResult resultWithStatus: CDVCommandStatus_OK messageAsString: addResult];
- //传值(消息)到JS文件//
- [self.commandDelegate sendPluginResult: result callbackId: command.callbackId];
- } else {
- result = [CDVPluginResult resultWithStatus: CDVCommandStatus_ERROR messageAsString: @"cuowu"];
- // [self.commandDelegate sendPluginResult:result callbackId:command.callbackId]; }
- [self.commandDelegate sendPluginResult: result callbackId: command.callbackId];
- }@end * *************我是分隔符 * **********************************CeshiPlugin.js文件cordova.define("com.example.CeshiPlugin.CeshiPlugin",
- function(require, exports, module) {
- var wang = require('cordova/exec');
- module.exports = { //自定义方法
- addstr: function(addSuc, addFaild, args, args2, args3) {
- /* 第一个参数:回调成功参数
- 第二个参数:回调失败参数
- 第三个参数:JS要调用OC类的名字参数
- 第四个参数:要调用方法的名字
- 第五个参数:要传递的参数,以JSON格式 */
- wang(addSuc, addFaild, "CeshiPlugin", "addstr", [args, args2, args3]);
- }
- };
- }); * *************我是分隔符 * **********************************plugin.xml文件 < span style = "font-size:14px;" > <?xml version = "1.0"encoding = "UTF-8" ? ><!--id = 插件的唯一标识--><plugin xmlns = "http://apache.org/cordova/ns/plugins/1.0"id = "com.example.CeshiPlugin" //此ID需与创建项目时的第二个参数即应用标识一致
- version = "2.0" > <!--name:插件的名称--><name > HelloPlugin < /name>
- <!--description:描述信息-->
- <description>
- This plugin allows you to show a MyPlugin.
- A Toast is a little non intrusive buttonless popup which automatically disappears.
- </description > <license > MIT < /license>
- <!-- js-module:对应我们的 javascript 文件,src 属性指向 www/xxx.js路径--><js - module src = "www/CeshiPlugin.js"name = "CeshiPlugin" > <clobbers target = "myplugin" / ></js-module>
- <!-- platform:支持的平台ios -->
- <platform name="ios">
- <config-file target="config.xml" parent="/ * ">
- <feature name="CeshiPlugin ">
- <param name="ios - package " value="CeshiPlugin "/>
- </feature>
- </config-file>
- <header-file src="src / ios / CeshiPlugin.h "/>
- <source-file src="src / ios / CeshiPlugin.m "/>
- <framework src="QuartzCore.framework " />
- </platform>
- </plugin>
- **************我是分隔符***********************************
- 7、到这就基本OK了,可以将插件打包整理好,自己测试和提交给别人使用了。
- 打包步骤:
- 1、建立一个插件根目录,格式最好如下:com.liki.xxxPlugin
- 2、在xxxPlugin下建立www和src目录。
- 3、将plugin.xml配置文件拷贝到xxxplugin目录。
- 4、在src目录下建立ios目录,其他平台也行,笔者没有试过,不过官网上说支持。
- 5、将ios原生的类文件拷贝相应目录内。
- 6、将写好的JS文件拷贝到www目录下。
- **************我是分隔符***********************************
- 使用插件步骤,这里就简单说明一下,因为需要具备Cordova和JS以及html相关知识,只能给演示代码
- Html文件调用
- <script type="text / javascript ">
- document.addEventListener("deviceready ", onDeviceReady, false);
- function onDeviceReady() {
- /**
- * 加载成功调用js
- */
- myplugin.addstr(addSuc,addFiald,"wang ","zhao ","bin ");
- }
- </script>
- <script √>
- /**
- * js回调函数
- */
- function addSuc(result) {
- alert('回调成功addSuc='+result);
- }
- function addFiald(result) {
- alert('addFiald='+result);
- }
- </script></span>"
来源: http://lib.csdn.net/snippet/ios/42441