IOS培训
美国上市IOS培训机构

400-111-8989

热门课程

开发自己的cordova插件

  • 发布:iOS培训
  • 来源:网络
  • 时间:2018-06-08 18:42

那么今天说道的内容也是ios培训课程中讲到的哦!首先,必须要有cordova的开发环境,本人做的是ionic的开发,所以环境是ionic的开发环境,不过对开发cordova插件两者皆可。环境的搭建可以看这里ionic项目环境搭建。

其次,本人选择了几个工具,用于编辑cordova插件,分别是:WebStrom、Android studio、GapDebug。既然说到这里了,就简单说明一下这几个工具的作用。WebStrom:网页开发IDE,主要用来写写js、html。Android studio:不用说,Android开发IDE,个人习惯用Android studio,用eclipse也没什么问题。GapDebug:调试软件,ionic项目,或者说cordova项目不像Android 项目,也不像单纯的网页,因为是跨平台,所以调试起来就比较麻烦了。

用cordova做地图定位,由于phonegap100上没有合适自己的插件,iOS的定位已经做好了,要是把它做成插件就好将结果调到H5界面上去了。于是捣鼓了一个多星期,终于将一个地图定位插件做好了。下面分享一下这个插件开发过程。

第一步,是在创建xcode工程 完成地图定位功能,实现功能后,并进行真机测试,达到自己想要的要求。

第二步,创建一些文件夹以及文件,文件夹结构如下图所示:

开发cordova插件

这个插件我把它命名为Map, 里边包含src 和www两个文件夹。src这个文件夹主要是用来存放对应平台的原生工程文件。如果你需要使用安卓或者WP的支持也可以。我这里只做了iOS的。www,这个文件夹是一个js文件。

创建一个plugin.xml文件 和 Map.js文件

plugin.xml文件里边的内容:

32<!--?xml version="1.0" encoding="UTF-8"?-->

<plugin xmlns="http: apache.org="" cordova="" ns="" plugins="" 1.0"="" id="cordova-plugin-Map" version="1.1.1-dev">

<name>Map</name>

<description>Cordova Map Plugin</description>

<author>YT</author>

<license>Apache 2.0</license>

<keywords>cordova,QRCode</keywords>

<repo>https://git@github.com:OceanOver/QRCode.git</repo>

<js-module src="www map.js" name="Map">

<clobbers target="map" >

<!-- ios -->

<platform name="ios">

<config-file target="config.xml" parent=" *"="">

<feature name="map">

<param name="ios-package" value="cdvmap" >

<header-file src="src ios="" cdvmap.h" ="">

<source-file src="src ios="" cdvmap.m" ="">

<header-file src="src ios="" locationviewcontroller.h" ="">

<source-file src="src ios="" locationviewcontroller.m" ="">

<framework src="corelocation.framework" >

<framework src="mapkit.framework" >

</framework src="mapkit.framework" ></framework src="corelocation.framework" ></source-file src="src></header-file src="src></source-file src="src></header-file src="src></param ame="ios-package" value="cdvmap" ></feature ame="map"></config-file target="config.xml" parent="></platform ame="ios"></clobbers target="map" ></js-module src="www></plugin xmlns="http:>

开发cordova插件

注意:如果你的工程需要添加依赖库 必须卸载这里才可以,然后添加的时候就可以自动导入了。

CDVMap.h的代码,这个类继承自Cordova/CDVPlugin.h

63//

// CDVMap.h

// HelloWorld

//

// Created by JUST-IMAC on 16/3/17.

//

//

#import <cordova cdvplugin.h="">

@interface CDVMap : CDVPlugin

- (void)map:(CDVInvokedUrlCommand*)command;

@end

//

// CDVMap.m

// HelloWorld

//

// Created by JUST-IMAC on 16/3/17.

//

//

CDVMap.m的代码

#import "CDVMap.h"

#import "LocationViewController.h"

@interface CDVMap ()

@end

@implementation CDVMap

- (void)map:(CDVInvokedUrlCommand*)command {

NSString *callBackId = command.callbackId;

//将callbackId;传入你的控制器中

LocationViewController *qrCodeController = [[LocationViewController alloc] init];

qrCodeController.callBackId = callBackId;

qrCodeController.qrCode = self;

//调用原生控制器

[self.viewController presentViewController:qrCodeController animated:YES completion:nil];

}

@end

LocationViewController.h的代码

//

// LocationViewController.h

// 系统地图定位

//

// Created by admin on 16/7/9.

// Copyright © 2016年 davidde. All rights reserved.

//

#import <uikit uikit.h="">

#import "CDVMap.h"

@interface LocationViewController : UIViewController

//这两个参数是必须的

@property(nonatomic,weak) CDVMap *qrCode;

@property(nonatomic,copy) NSString *callBackId;

@end</uikit></cordova>

LocationViewController.m的代码

这里边的代码我就不贴了,

这里我需要在原生地图中获取得到的定位信息,传到h5界面中处理。

于是调用

Map.js里边的代码

开发cordova插件

这里不需要上传到git,所以不需要做package.json文件里边的处理

到此一个插件已经基本上做好了

接下来是调用这个插件了

在终端cd 到你工程文件夹目录

输入命令

1sudo ionic plugin add [插件所在的目录]

目录直接将你的[Map这个插件拖进去就而已了]

完成之后打开platforms中的iOS目录找到你的项目工程就可以看到你的插件安装成功了

在plugin文件夹中你会看到你所添加的插件cordoba-plugin-Map这个文件夹

此时 就是在js中调用了

14<input type="button" onclick="getinfo()" value="地图">

<script>

function getInfo() {

Map.map(success);

function success(info) {

alert(info);

}

};

</script></input type="button" onclick="getinfo()" value="地图">

此时就可以成功调用了。如果你还需要修改你的插件,还可以在工程里边修改,这里就不做态度描述了。

更多iOS培训类相关知识敬请关注ios培训官网ios.tedu.cn

免责声明:内容和图片源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容

预约申请免费试听课

上一篇:MXNet的iOS版本编译
下一篇:ios开发中libstdc++适配Xcode10与iOS12

IOS库开发知识点总结和归纳

IOS Swift实战开发经验总结,IOSSwift开发经验分享

IOS设计 - 一款APP从设计稿到切图过程概述

2017年IOS开发者账号申请以及邓白氏码的申请教程经验

选择城市和中心
贵州省

广西省

海南省