文档章节

iOS使用Objective-c自定义cordova插件(-)

Michaelyn
 Michaelyn
发布于 2017/10/23 13:44
字数 825
阅读 19
收藏 0

 

本系列教程为博主初次使用开发,内容如有差错,欢迎指正,敬请谅解。 

博客地址:http://blog.img421.com/iosshi-yong-object-czi-ding-yi-cordovacha-jian/

   Mac安装ionic和cordova我们已经熟悉,现在使用`ionic`来创建`HTML5`使用`iOS原生框架`等内容的插件。  

  说明:图中的cordova 请自动切换为ionic使用

1.  创建项目

打开终端,切换到桌面,然后使用`ionic`创建一个测试项目,命名CountTest.

cd ./Desktop/

sudo ionic start CountDemo    

 或   

   //使用cordova ,但是后期cordova不知道怎么引导ionic中,如果你知道请留言告诉我,感谢!        sudo cordova create CountDemo com.twenty.CountDemo CountDemo

1: 项目创建到桌面的目录名,

2: iOS Bundle Identifier的名称,

3: 项目名若舍去2,3步骤,iOS Bundle ID会自行创建,3中项目名为默认1中的目录名。

我们创建的项目没有可写权限只有可读权限,因为修改CountTest权限为可读可写可执行。

由此可以修改CountTest文件及子文件。

2.  编译iOS项目工程

通过使用`ionic`编译出`iOS项目结构`的目录平台。命令如下:

//添加iOS项目的平台

sudo ionic platform add ios    

或 sudo  cordova platform add ios 

下图输出则添加成功

 

等待几分钟

//编译iOS项目

sudo ionic build ios   

或  sudo cordova build ios

 

如上图`** BUILD SUCCEEDED **`成功以后,可以看到文件中`platform`添加一个iOS平台文件夹。

使用苹果官方开发工具`Xcode`打开,如果没有权限使用命令修改权限:

 

sudo chmod -R 777 .

`. 代表当前文件夹` ,

打开后结构如下

我们自定义的插件都在`Plugins`文件夹下.

3. 插件开发

创建一个`CountAdd`对象,继承`CDVPlugin`对象.

ps:`CDVPlugin`即为cordova库的连接对象。

`Command + B` 编译Xcode,程序报错`'Cordova/Cordova.h' file not found`

通过查看`CordovaLib`库文件内容,此库内容中头文件`CDV.h`包涵全部的类头文件,因此修改如下:

再次编译成功.

CountAdd.h文件中,声明一个方法:计算大小.`CDVInvokedUrlCommand *`对象为调用URL命令的时候自动传递的参数。在`CountAdd.m`中实现此方法。

 

`CountAdd.m`中,我们添加如下代码:

1: 获取到调用的命令的唯一ID;

2:得到传过来的数组的第一个索引值;(后续详细解释)

3:给得到的数+1;

5:通过判断给插件的结果设置状态,成功状态 message 所传递的值, 失败状态 message 所传递的值;

6:通过调用代理发送插件的结果给对应的ID

4. 配置

通过使用WebStorm来打开所创建的`CountDemo`项目,在项目中的`Plugins`文件夹中我们创建一个自己的插件目录`com.twenty.CountTest`,结构如下:

 

ios:存放Xcode刚才所创建的CountAdd类,

www: 存放调用的和CountAdd 所调用的js文件

plugin.xml :配置iOS 和 cordova 的内容.拷贝`OC的类`到`ios文件夹`目录下,`www`目录下创建一个与`oc类名一样`的js文件

 

`plugin.xml`文件内容如下图:

 

方框内的name要一致,名字随意;

圆形内的值要与OC中继承CDVPlugin类的类名一致;

横线部分名称要与js名称一致    

本文转载自:http://www.jianshu.com/p/10cca2464fcf

Michaelyn
粉丝 7
博文 147
码字总数 30289
作品 0
广州
其他
私信 提问
cordova与ios native code交互的原理

很早以前写了一篇博客,总结cordova插件怎么调用到原生代码: cordova调用过程,不过写得太水,基本没有提到原理。最近加深了一点理解,重新补充说明一下 js调用native 下面是我们产品中的代...

Michaelyn
2017/10/23
34
0
开发环境搭建

//创建项目 项目路径 项目命名空间,项目名称 Cordova create /Users/indeed/Desktop/Project/2015/NE20141206AuchanDrive/55-Coding cn.auchan.auchandrive auchandrive //进入项目路径 cd......

KevinZhang_
2014/12/26
11
0
Cordova 3.x 基础(1) -- 环境搭建(Windows / Android)

Cordova 3.x 基础(1) -- 环境搭建(Windows / Android) Mobile App分为三大类:Native App,Hybrid App,Web App。其中Hybrid App介于Native App和Web App之间,它能兼顾Native App的良好用...

youxizhe
2014/09/29
415
0
Cordova 和 Ionic 的区别

Cordova Apache Cordova是一个开源的移动开发框架。允许你用标准的web技术-HTML5,CSS3和JavaScript做跨平台开发。 应用在每个平台的具体执行被封装了起来,并依靠符合标准的API绑定去访问每个...

华山猛男
2018/11/07
172
0
phoneGap3.0安装步骤(以windows下的android环境为例):

phoneGap3.0安装步骤(以windows下的android环境为例): 环境: WIN系统,JDK,Android,Eclipse,Ant,Git,PhoneGap3.x (Cordova) 1. 安装JRE,设置JAVAHOME,比如JAVAHOME=C:programJavaj...

kisshua
2014/03/05
106
0

没有更多内容

加载失败,请刷新页面

加载更多

用原生js对表格排序

本文转载于:专业的前端网站➸用原生js对表格排序 阿里的模拟笔试题,当时时间有限没写出来,其实是因为自己对原生dom操作不熟悉,这里补一下。 题目的大意是有一个表格,如代码所示 <table>...

前端老手
39分钟前
6
0
IT兄弟连 HTML5教程 HTML5表单 HTML5新增表单元素

HTML5有一些新的表单元素:<datalist>、<keygen>、<output>。不是所有的浏览器都支持HTML5新的表单元素,但即使浏览器不支持该表单属性,仍然可以显示为常规的表单元素。 1 <datalist>元素 ...

老码农的一亩三分地
40分钟前
4
0
【朝花夕拾】Android自定义View篇之(一)View绘制流程

https://www.cnblogs.com/andy-songwei/p/10955062.html

shzwork
42分钟前
5
0
Qt编写自定义控件70-扁平化flatui

一、前言 对于现在做前端开发人员来说,FlatUI肯定不陌生,最近几年扁平化的设计越来越流行,大概由于现在PC端和移动端的设备的分辨率越来越高,扁平化反而看起来更让人愉悦,而通过渐变色产...

飞扬青云
51分钟前
3
0
教你玩转Linux—添加批量用户

添加和删除用户对每位Linux系统管理员都是轻而易举的事,比较棘手的是如果要添加几十个、上百个甚至上千个用户时,我们不太可能还使用useradd一个一个地添加,必然要找一种简便的创建大量用户...

Linux就该这么学
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部