Cordova iOS插件开发流程

作者: 半月迎风 | 来源:发表于2018-04-09 22:03 被阅读177次

[ios开发Cordova插件] - 支持入参及调回的插件开发
Cordova iOS插件开发流程
Cordova进行iOS开发 (已存FFmpeg项目中添加Cor
使用Cordova开发iOS App -- 开发iOS插件
iOS cordova 插件开发
ionic cordova 插件之热更新
CoreThink技术分享之：快速APP开发之Cordova微信
Cordova入门开发经验
iOS Cordova插件开发（一）之plugin.xml文件编
Cordova+ ios 插件开发

用cordova做地图定位，由于phonegap100上没有合适自己的插件，iOS的定位已经做好了，要是把它做成插件就好将结果调到H5界面上去了。于是捣鼓了一个多星期，终于将一个地图定位插件做好了。下面分享一下这个插件开发过程。
第一步，是在创建xcode工程完成地图定位功能，实现功能后，并进行真机测试，达到自己想要的要求。
第二步，创建一些文件夹以及文件，文件夹结构如下图所示：

224439.png

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

<?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" />
    </js-module>

     <!-- ios -->
     <platform name="ios">
         <config-file target="config.xml" parent="/*">
             <feature name="Map">
                 <param name="ios-package" value="CDVMap" />
             </feature>
         </config-file>

         <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" />
     </platform>
</plugin>

615A269A-EE53-4143-849E-2DF7FDBE533F.png

注意：如果你的工程需要添加依赖库必须卸载这里才可以，然后添加的时候就可以自动导入了。
CDVMap.h的代码，这个类继承自Cordova/CDVPlugin.h

//
//  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

LocationViewController.m的代码
这里边的代码我就不贴了，
这里我需要在原生地图中获取得到的定位信息，传到h5界面中处理。
于是调用
Map.js里边的代码

665009B4-81FF-4646-BABF-0B8447B30A72.png

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

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

接下来是调用这个插件了
在终端cd 到你工程文件夹目录
输入命令

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

目录直接将你的[Map这个插件拖进去就而已了]
完成之后打开platforms中的iOS目录找到你的项目工程就可以看到你的插件安装成功了
在plugin文件夹中你会看到你所添加的插件cordoba-plugin-Map这个文件夹
此时就是在js中调用了

<input type="button" onclick="getInfo()" value="地图"> 
  <script>
      function getInfo() {
          
        Map.map(success);

         function success(info) {
           
            alert(info);
            
            
         }
    };
  </script>