cordova的功能

利用cordova可以做到html调用iOS/安卓原生插件的功能。

一、安装cordova环境：

1、xcode

2、安装node.js

去官网下载Node.js然后安装

3、使用终端安装cordova

打开终端输入命令：sudo npm install -g cordova 

npm管理cordova工具

4、创建运行项目

1、首先cd到桌面，运用终端创建一个项目

cordova create firstCordovaFile com.kay.firstCordova firstCordova

firstCordovaFile:对应你整个项目的文件夹名称

com.kay.firstCordova:对应至之后ios工程的bundleID

firstCordova:对应至之后ios工程名

2、创建ios工程

进入项目文件夹：cd firstCordovaFile

创建ios工程 : cordova platform add ios 

注意：ios必须小写

这时候在项目文件夹下的"platforms"文件夹中会多出ios文件夹,进入后就可以看到ios工程了.

二、开发插件：

h5前端和iOS代码之间的交互，主要就在Staging文件件下的index.html文件里，在index.html里编写js代码调用iOS原生代码。这中间就是个映射过程。

1、这里我们先创建写iOS原生插件代码的地方，在plugins里我们可以找到刚刚创建的com.kay.firstCordova文件夹，在这里创建代码文件，继承cordova的框架CDVPlugin,这里的工程名比较重要，在映射的地方要对应上。

.h文件夹会报红，修改为#import <Cordoba/CDVPlugin.h>

.h里写好方法名-(void)helloCordova:(CDVInvokedUrlCommand *)command;

这里helloCordova就为之后交互的方法调用名，可以随意根据插件名修改，后面的(CDVInvokedUrlCommand *)command;不变。

.m里实现

以上iOS原生就是一个打印传进来参数的功能，两个回调可以根据插件需要调用，插件可传参也可不传，都是根据需求。

2、这里我们进入Staging里的index.html,编写js代码，调用原生.h里的方法。

先写一个button，在这个button里的点击事件里，我们调用刚刚的方法。

Staging里的index.html

cordova.exec(alertSuccess,alertFail,"firstCordovaJS","helloCordova",["Hey,I'm JS!"]);

firstCordovaJS对应下面配置文件里的firstCordovaJS，helloCordova是原生文件里的方法名

3、配置Staging里config.xml文件

这个文件的配置就是使cordova找到原生插件和index.html里的方法的映射

以上就做完了一个插件的开发，但是还没有做插件打包以及js的映射。

三、打包插件以及测试：

首先安装pliginman  ：npm install -g pluginman

用pluginman在桌面创建插件 : plugman create --name [名字]--plugin_id[包名] --plugin_version 1.0.0

plugman create --name firstCordova --plugin_id com.kay.plugin.firstCordova --plugin_version 1.0.0

这样桌面就创建了插件包，如图:

1、我们吧上面的原生插件放在src文件夹里

2、配置plugin.xml文件：

plugin.xml

1、是需要注意删掉的地方

2、这部分就是映射部分，和找到文件路径设置

plugin.xml

3、配置www文件夹里的js文件

js文件

讲coolMethod改为helloCordova

4、安装插件并测试

至此为止,插件的开发已经全部完成了,所谓的打包其实就是我们那个带配置文件的插件文件夹

新建一个cordova项目并且将我们的本地插件添加进去进行测试一下

1.新建一个cordova项目并且添加ios工程

2.cd进入到项目的目录下

3.添加刚刚创建的本地插件包：cordova plugin add 插件路径

这里需要注意，测试项目里存在的插件再安装会报错，我先查看测试项目里究竟有没有这个插件包，查看插件列表：cordova plugin ls ，删除插件：cordova plugin remove 包名，通过查看列表，得到包名，然后可以删除再安装

4.进行测试,通过js的语法去调用插件

在staging的index.html里

这样整个基本流程完成。