cordova 3.0以上ios自定义插件

搞了半个月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名称Plugin

  3、打开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>




 


评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值