一泌类、配置cordova開發(fā)環(huán)境并添加ios平臺(tái)支持
下面建立一個(gè)連接安卓系統(tǒng)電視棒和手機(jī)端，實(shí)現(xiàn)屏幕拷貝底燎，文件共享等功能的demo刃榨。
1.通過終端命令創(chuàng)建一個(gè)項(xiàng)目
cordova create TestPlugin com.testPlugin.zzj TestPlugin
//create 后面的參數(shù)分別對(duì)應(yīng)是"項(xiàng)目的文件夾名稱"、"ios工程的bundleID"双仍、"ios工程名"
2.為項(xiàng)目添加ios平臺(tái)支持
//首先cd 進(jìn)入到工程目錄下枢希，然后運(yùn)行
cordova platform add ios
3.使用xcode打開目錄進(jìn)行正常流程ios開發(fā)
4.在plugin目錄下建立文件夾，命名方式類似bundleID格式朱沃，建立.h .m文件苞轿，繼承自CDVPlugin類茅诱，插件的主要邏輯都在這里實(shí)現(xiàn)。如果插件需要靜態(tài)庫(kù)依賴也把對(duì)應(yīng)的framework或.a文件也加入到新建的文件夾下搬卒。
在.m文件中寫native方法供js調(diào)用瑟俭，需要注意的是入?yún)⒈仨毷荂DVInvokedUrlCommond類，js調(diào)用失敗時(shí)根據(jù)callbackId傳送對(duì)應(yīng)的失敗信息
5.在staging目錄下的config.xml文件下添加下面代碼契邀，讓js能識(shí)別原生中調(diào)用的類及調(diào)用類的方法
//eshareModel是model名稱摆寄，value后面的"linkmeEshare"是.h文件中實(shí)現(xiàn)邏輯所屬的類，就是一開始繼承CDVPlugin那個(gè)
<feature name="eshareModel">
<param name="ios-package" value="linkmeEshare" />
</feature>
6.在Staging下的index.html文件寫一個(gè)按鈕測(cè)試js能不能正常調(diào)用原生方法坯门。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" charset="utf8">
//調(diào)用OC插件方法
function alertShow() {
//通過cordova將成功調(diào)用執(zhí)行的fun椭迎、失敗執(zhí)行的fun 模型名稱，方法名田盈，參數(shù)傳入cordova.exec
cordova.exec(alertSuccess,alertFail,"eshareModel","showEshareDevices",["設(shè)備名稱："]);
}
function alertSuccess(msg) {
alert('調(diào)用oc成功：' + msg);
}
function alertFail(msg) {
alert('調(diào)用oc失斝蠛拧：' + msg);
}
</script>
<button style="font-size:17px;" onclick="alertShow();">調(diào)用OC插件 </button> <br>
</body>
</html>
運(yùn)行工程，可以看到效果如圖：
到這里代表插件功能開發(fā)完成并通過測(cè)試允瞧，下一步是把cordova插件加入到ionic框架中简软，提供給js、ts調(diào)用述暂。
二痹升、在ionic中添加cordova插件并調(diào)用。
把cordova工程中的插件導(dǎo)入到ionic中有兩種方法畦韭，一種是利用plugman命令創(chuàng)建一個(gè)新插件工程疼蛾，替換資源文件及配置文件。
另一種是創(chuàng)建打包文件夾艺配，把資源文件和配置文件放到特定的位置察郁。
首先保證終端中已經(jīng)安裝好plugman，然后執(zhí)行下面命令新建一個(gè)插件工程转唉，并添加ios平臺(tái)
plugman create --name esharePlugin --plugin_id esharePlugin --plugin_version 1.0.0
plugman platform add --platform_name ios
復(fù)制上面cordova工程中的framework文件皮钠、.h、.m文件到插件的ios文件夾下赠法，并且修改plugin.xml配置文件以及www文件夾下的js文件麦轰。
配置文件中包含插件所引用的資源以及其他設(shè)置，js文件里面負(fù)責(zé)對(duì)原生方法的調(diào)用砖织。
關(guān)于xml文件中各項(xiàng)的意義可以查看：
cordova Plugin.xml 詳解
最后修改js文件
var exec = require('cordova/exec');
exports.coolMethod = function (arg0, success, error) {
exec(success, error, 'esharePlugin', 'showEshareDevices', [arg0]);
};
把插件導(dǎo)入到ionic中款侵，添加支持平臺(tái)并且運(yùn)行。
ionic cordova plugin add /Users/jeffrey.z/esharePlugin
如果出現(xiàn)needs a valid package.json侧纯，則要先進(jìn)入到插件目錄運(yùn)行
npm init
在ionic中需要調(diào)用的ts頁面下新锈，添加下面代碼
declare let cordova: any;
//調(diào)用成功的回調(diào)函數(shù)
alertSuccess(msg) {
alert(msg);
}
//調(diào)用失敗的回調(diào)函數(shù)
alertFail(msg) {
alert('調(diào)用OC失敗: ' + msg);
}
//調(diào)用OC插件方法
alertShow() {
//通過js代碼調(diào)用
let avgArr:string[] = ["Hey,獲取設(shè)備!"];
cordova.plugins.esharePlugin.coolMethod(this.alertSuccess,this.alertFail,avgArr);
}
eshareTest() {
this.alertShow();
}
在html頁面下添加一個(gè)測(cè)試按鈕
<button ion-button block (click)="eshareTest()">
showEshare
</button>
執(zhí)行
ionic build iOS
運(yùn)行結(jié)果如圖
以上，cordova自定義插件開發(fā)完成茂蚓！
