Cordova那些事兒(四)——Cordova插件開發(fā)

Cordova LOGO
編寫規(guī)則

具體規(guī)則參見官網(wǎng)文檔锣险,比較清晰措拇,有示例秒际。
詳情參考:
Plugin Development Guide
iOS Plugin Development Guide
Android Plugin Development Guide

一赫模、Cordova-Plugin的組成部分
./cordova-plugin-network-information/
|-src/ ................................. 插件原生部分代碼
|  |-android/ .......................... Android 平臺
|  |  '-NetworkManager.java*
|  |-browser/ .......................... 瀏覽器 平臺
|  |  '-network.js
|  '-ios/ .............................. iOS 平臺
|      |-CDVConnection.h
|      |-CDVConnection.m
|      |-CDVReachability.h
|      '-CDVReachability.m
|-tests/ ............................... 測試
|  |-plugin.xml
|  '-tests.js
|-www/ ................................. 與原生橋接的 JS树肃,如果不同平臺代碼有差異,這個文件夾下瀑罗,也可以再分平臺
|  |-android/
|  |-ios/
|  |-Connection.js
|  '-network.js
|-package.json ......................... 描述文件(用于在代碼庫注冊關(guān)鍵字胸嘴、描述依賴等)
`-plugin.xml ........................... 配置文件(安裝插件時,會安裝到平臺的 config.xml 中)
二斩祭、插件中劣像,負(fù)責(zé)橋接部分的 JS

可以多個平臺共用,如有區(qū)別摧玫,也可以每個平臺分開編寫

cordova.define("mytestplg.ttt", function(require, exports, module) {
    var exec = require('cordova/exec');

    // 成功回調(diào)函數(shù)
    function successCallback(oo) {
        alert('ok ' + oo);
    }

    // 失敗回調(diào)函數(shù)
    function failureCallback(ee) {
        alert('err ' + ee);
    }
    // 這里用于編寫對外提供的調(diào)用方法
    var myJSObj = {
        myAdd: function(arg1, arg2) {
            alert('exec');
            //6取!诬像!重要屋群!exec 是調(diào)用的核心方法,這里 exec 的五個參數(shù):
            var ret = exec(
                successCallback, // 成功回調(diào)函數(shù)
                failureCallback, // 失敗回調(diào)函數(shù)
                "MyPlugin2",     // config.xml 中對應(yīng) feature 的 name
                "doMyAdd",       // iOS 中為調(diào)用的具體方法名坏挠,通過 runtime 執(zhí)行芍躏;Android中會執(zhí)行固定方法,但是會把這個值作為參數(shù)傳入降狠,原生 Android 代碼根據(jù)參數(shù)值來做區(qū)分執(zhí)行
                [arg1, arg2]     // 參數(shù)數(shù)組
            );
            alert('rrr ' + ret);
            return ret;
        },
        vv: 'abc'
    };
    module.exports = myJSObj;
});
三对竣、插件配置文件 plugin.xml

插件配置文件,安裝時榜配,根據(jù)配置否纬,做相應(yīng)平臺的設(shè)置

  • header-filesource-file 標(biāo)簽:插件原生代碼路徑蛋褥,用于將文件復(fù)制到各個工程原生代碼中
  • config-file 標(biāo)簽:用于指定配置文件
  • feature 標(biāo)簽:重要A偃肌!!用于指定各平臺插件的配置方案谬俄,安裝時柏靶,會把相應(yīng)平臺的配置,插入各個平臺的 config.xml溃论。插件負(fù)責(zé)橋接的 JS 中屎蜓,exec 的第三個參數(shù),就是 featurename钥勋,feature 中炬转,會指定插件加載的具體類
  • js-module 標(biāo)簽:指定平臺橋接 JS 的文件
  • clobbers 標(biāo)簽:指定平臺橋接 JS 中輸出的對象注入的全局變量。由于這個變量由 HTML 開發(fā)人員在各平臺統(tǒng)一調(diào)用算灸,所以該值盡量要在各平臺保持一致扼劈,這部分會被插入到 cordova_plugins.js 中,格式如下:
/**
    cordova_plugins.js
    此文件由命令行根據(jù)配置文件自動生成菲驴,不用修改荐吵。
    這里只做格式展示。
*/
cordova.define('cordova/plugin_list', function(require, exports, module) {
    module.exports = [{
        "file": "plugins/mytestplg/www/ttt.js", //js接口文件
        "id": "mytestplg.ttt", //標(biāo)識
        "pluginId": "mytestplg-ttt", //標(biāo)識
        "clobbers": [
            "ttt" //注入到瀏覽器中的變量名
        ]
    }];
});

<!-- plugin.xml赊瞬,此文件需要插件開發(fā)時自行編寫先煎,與插件一起提供 -->
<?xml version="1.0" encoding="UTF-8"?>
<plugin id="mocha-plugin-demo" version="0.1.0" xmlns="http://apache.org/cordova/ns/plugins/1.0">
    <name>Plugin Demo</name>
    <author>Mocha</author>
    <description>插件演示</description>
    <license>MIT</license>
    <keywords>cordova, javascript</keywords>
    <repo/>
    <issue/>
    <!-- android -->
    <platform name="android">
        <source-file src="src/android/WebViewBack.java" target-dir="src/com/mochasoft/cordova/plugins/webback"/>
        <config-file parent="/*" target="res/xml/config.xml">
            <feature name="WebViewBack">
                <param name="android-package" value="com.mochasoft.cordova.plugins.webback.WebViewBack"/>
            </feature>
        </config-file>
        <js-module name="webviewback" src="www/android/goback.js">
            <clobbers target="WebViewBack"/>
        </js-module>
    </platform>
    <!-- ios -->
    <platform name="ios">
        <header-file src="src/ios/WebGoBack.h"/>
        <source-file src="src/ios/WebGoBack.m"/>
        <config-file parent="/*" target="config.xml">
            <feature name="WebViewBack">
                <param name="ios-package" value="WebGoBack"/>
                <param name="onload" value="true"/>
            </feature>
        </config-file>
        <js-module name="webviewback" src="www/ios/webviewback.js">
            <clobbers target="WebViewBack"/>
        </js-module>
    </platform>
</plugin>
四、原生插件編寫(iOS)
插件的實現(xiàn)巧涧,繼承關(guān)系薯蝎,返回值方式

插件繼承自 CDVPlugin

/**
    插件原生相關(guān)代碼
 */

// ========================== MyPlugin.h ==================================
@interface MyPlugin : CDVPlugin
- (void)myInvokeMethod:(CDVInvokedUrlCommand *)command; // 具體執(zhí)行的方法
@end
// ========================== MyPlugin.m ==================================
@interface MyPlugin ()
@end

@implementation MyPlugin

// 具體執(zhí)行方法的實現(xiàn)
- (void)myInvokeMethod:(CDVInvokedUrlCommand *)command {

    // 通過command變量獲取參數(shù)方式:
    id argument = [command argumentAtIndex:0 withDefault:@(50)];

    //初始化用于保存結(jié)果的 Dictionary
    NSMutableDictionary *result_dict = [NSMutableDictionary dictionary];
    CDVPluginResult *pluginResult = nil;
    if (執(zhí)行成功) {
        // 配置成功時的 result_dict
        pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK
                                     messageAsDictionary:result_dict];
    }else {
        NSString *errMsg = [self getErrorMsg:self.errCode];
        // 配置失敗時的 result_dict
        pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR
                                     messageAsDictionary:result_dict];
    }
    
    // 執(zhí)行回調(diào)
    [self.commandDelegate sendPluginResult:pluginResult
                                callbackId:command.callbackId];
}

@end
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市谤绳,隨后出現(xiàn)的幾起案子占锯,更是在濱河造成了極大的恐慌,老刑警劉巖缩筛,帶你破解...
    沈念sama閱讀 212,383評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件消略,死亡現(xiàn)場離奇詭異,居然都是意外死亡歪脏,警方通過查閱死者的電腦和手機(jī)疑俭,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,522評論 3 385
  • 文/潘曉璐 我一進(jìn)店門粮呢,熙熙樓的掌柜王于貴愁眉苦臉地迎上來婿失,“玉大人,你說我怎么就攤上這事啄寡『拦瑁” “怎么了?”我有些...
    開封第一講書人閱讀 157,852評論 0 348
  • 文/不壞的土叔 我叫張陵挺物,是天一觀的道長懒浮。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么砚著? 我笑而不...
    開封第一講書人閱讀 56,621評論 1 284
  • 正文 為了忘掉前任次伶,我火速辦了婚禮,結(jié)果婚禮上稽穆,老公的妹妹穿的比我還像新娘冠王。我一直安慰自己,他們只是感情好舌镶,可當(dāng)我...
    茶點故事閱讀 65,741評論 6 386
  • 文/花漫 我一把揭開白布柱彻。 她就那樣靜靜地躺著,像睡著了一般餐胀。 火紅的嫁衣襯著肌膚如雪哟楷。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,929評論 1 290
  • 那天否灾,我揣著相機(jī)與錄音卖擅,去河邊找鬼。 笑死墨技,一個胖子當(dāng)著我的面吹牛磨镶,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播健提,決...
    沈念sama閱讀 39,076評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼琳猫,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了私痹?” 一聲冷哼從身側(cè)響起脐嫂,我...
    開封第一講書人閱讀 37,803評論 0 268
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎紊遵,沒想到半個月后账千,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,265評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡暗膜,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,582評論 2 327
  • 正文 我和宋清朗相戀三年匀奏,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片学搜。...
    茶點故事閱讀 38,716評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡娃善,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出瑞佩,到底是詐尸還是另有隱情聚磺,我是刑警寧澤,帶...
    沈念sama閱讀 34,395評論 4 333
  • 正文 年R本政府宣布炬丸,位于F島的核電站瘫寝,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜焕阿,卻給世界環(huán)境...
    茶點故事閱讀 40,039評論 3 316
  • 文/蒙蒙 一咪啡、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧暮屡,春花似錦瑟匆、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,798評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至外厂,卻和暖如春冕象,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背汁蝶。 一陣腳步聲響...
    開封第一講書人閱讀 32,027評論 1 266
  • 我被黑心中介騙來泰國打工渐扮, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人掖棉。 一個月前我還...
    沈念sama閱讀 46,488評論 2 361
  • 正文 我出身青樓墓律,卻偏偏與公主長得像,于是被迫代替她去往敵國和親幔亥。 傳聞我的和親對象是個殘疾皇子耻讽,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,612評論 2 350

推薦閱讀更多精彩內(nèi)容