1. 程式人生 > >Ionic— Cordova 外掛開發

Ionic— Cordova 外掛開發

操作命令

npm install -g plugman          //安裝plugman
plugman create --name printPlug --plugin_id com.zmsoft.printPlug --plugin_version 0.0.1            //建立一個外掛專案
cd udpPlugin
plugman platform add --platform_name android

外掛的原型就搭建好了。

========================================================================================

如果外掛依賴第三方JAR 包,在Plugin中引入jar包,並且定義好target-dir

<source-file src="src/android/lib/element-connector-1.0.4.jar" target-dir="libs" />
<source-file src="src/android/lib/californium-core-1.0.4.jar" target-dir="libs" />
========================================================================================

為專案新增ngCordova外掛   進入到專案目錄中,執行  bower install ngCordova --save

==========================================================================================

www/printPlug.js 說明:
    exec 函式

exec(success, error, "udpPlugin", "coolMethod", [arg0]);
    success: 呼叫成功 回撥函式,
    error: 調用出錯 回撥函式,
    “printPlug”: 外掛名稱,
    “coolMethod”: 執行外掛裡的方法,
    [arg0]: 可選引數,執行方法的引數陣列。

外掛匯出:

cordova.define("com.zmsoft.plugins.printPlug.printPlug", function(require, exports, module) {
var exec = require('cordova/exec');
exports.coolMethod = function(arg0, success, error) {
    exec(success, error, "printPlug", "coolMethod", [arg0]);
};
exports.showToast = function(arg0, success, error) {
    exec(success, error, "printPlug", "show", [arg0]);
};

});
 JS 中呼叫外掛:
cordova.plugins.printPlug.showToast("我是Toast,你好Kitty1");
    //    cordova.plugins.printPlug.showToast("我是Toast,你好Kitty1");
cordova.plugins.printPlug.coolMethod('useless',
 function(okData) {
 alert(okData);
 },
 function(failData) {
 alert(failData);
 });

安裝外掛

到cordova專案裡,執行命令:

cordova plugin add ../printPlug
刪除

cordova plugin remove com.zmsoft.printPlug

附外掛程式碼:

////////////////////////////////////////////////////////////////////////////////////

package com.zmsoft.plugins.printPlug;

import org.apache.cordova.CordovaInterface;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CallbackContext;

import org.apache.cordova.CordovaWebView;
import org.apache.cordova.PluginResult;
import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import android.content.Context;
import android.util.Log;
import android.widget.Toast;

import static org.apache.cordova.device.Device.TAG;

/**
 * This class echoes a string called from JavaScript.
 */
public class printPlug extends CordovaPlugin {
  @Override
public void initialize(CordovaInterface cordova, CordovaWebView webView) {
    super.initialize(cordova, webView);
    Log.v(TAG, "Toast: initialization");
    Context context = this.cordova.getActivity().getApplicationContext();

  }
  private void showToast(String text){
    CordovaInterface cordova = this.cordova;
      Log.e("e11111111111111111", "Crop operation not supported on this device");
      Toast.makeText(cordova.getActivity(), text, Toast.LENGTH_LONG).show();
  }
  @Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {
     String message = args.getString(0);
        if (action.equals("coolMethod")) {
           // this.coolMethod(message, callbackContext);
          //Log.e("MyDemo", "process the req");
String str = android.os.Build.VERSION.RELEASE;
          PluginResult r = new PluginResult(PluginResult.Status.OK, str + message);
          r.setKeepCallback(true);
          callbackContext.sendPluginResult(r);
            return true;
        }else if("show".equals(action)) {
          showToast(message);
          callbackContext.success(message);
          return true;
        }
      return false;
    }

    private void coolMethod(String message, CallbackContext callbackContext) {
        if (message != null && message.length() > 0) {
            callbackContext.success(message);
        } else {
            callbackContext.error("Expected one non-empty string argument.");
        }
    }
}

相關推薦

IonicCordova 外掛開發

操作命令 npm install -g plugman          //安裝plugman plugman create --name printPlug --plugin_id com.zmsoft.printPlug --plugin_version 0.0.1 

ionic+cordova混合開發app【二、建立專案】

1、建立專案 1、cmd進入專案存放的位置 2、開啟ionic官網進入專案建立demo示例依照步驟執行命令列建立專案: 官網地址:http://ionicframework.com/docs//intro/tutorial/ ionic start 專案名稱 tabs 其中專案名稱表示你要給自

ionic+cordova混合開發app【一、環境搭建】

APP開發採用ionic進行開發,ionic官網http://ionicframework.com/docs/。 開發軟體採用Visual Studio,安裝包百度下載即可。 版本 ionic 3.9.2 node v8.12.0 cordova 6.5.0 1、node簡介: 1)Nod

Cordova外掛開發流程

Cordova外掛開發流程 外掛開發簡介:外掛的開發大體上分為查詢類外掛,操作類外掛,請求類外掛.每種外掛一般需要不同的處理及返回方式.大部分外掛的開發基本上都是在android原始碼的基礎上繼承CordovaPlugin類,使用CallBack物件返回結果。 Andr

iOS開發-Cordova配置-Cordova互動-Cordova外掛開發iOS專案接入Cordova-Cordova跳轉外部網頁

本期內容: Cordova 詳細配置 Cordova 接入iOS專案 Cordova 訪問外部網頁 Cordova iOS互動外掛開發 Cordova簡介 Cordova是一個開源的移動開發框架,它允許你使用WEB開發技術(HTML5、CSS3、JavaS

Windows環境下搭建Ionic+cordova環境開發混合移動APP

網上有多篇ionic開發環境搭建的文章,但是針對windows下的說明比較少,所以在這裡再補充一篇windows下的開發環境搭建文章 1.nodejs nodejs官網: https://nodejs.org/en/ 它會自動檢測當前OS型別,並提供下載地址 Windows

Cordova外掛開發(3)- 將Cordova外掛釋出到npm

本篇文章講述的是如何將自己開發的cordova外掛釋出到npm,具體內容包含以下三個方面: 1,將外掛上傳到github; 2,將外掛釋出到npm; 3,將npm上的外掛與github上同步; 詳

Cordova外掛開發

一、在Cordova中,通過JS呼叫native的介面進行原生代碼的呼叫和顯示,進行Hybird,而這樣的native的封裝使用了plugin的方式。 二、這些plugin從cordova.js該檔案中可窺端倪,諸如: cordova.define(

cordova 外掛 開發新增 android 許可權

在自己外掛的plugin.xml檔案中找到android 並新增 <!-- android --> <platform name="android"> <co

cordova外掛開發,簡單教程

cordova版本:5.1.1 cordova外掛開發文件(主要是翻譯,方便查詢) 一.JavaScript interface cordova.exec(function(winParam) {}, function(error) {}

Cordova外掛開發(2)-Android外掛安裝包製作詳解

本篇文章講述的是如何製作自己的Cordova外掛安裝包(Android),具體內容包括以下三個方面: 1,安裝和使用plugman; 2,開發自己的Cordova外掛安裝包; 3,外掛安裝包的安裝與解除安裝; 本篇文章以自定義加密壓縮檔案外掛的實踐過程為例,本人不會IOS,

Ionic 跨平臺開發Cordova外掛清單及使用說明

一,外掛相關常用命令1,檢視所有已經安裝的外掛     cordova plugin ls2,安裝外掛(以camera外掛為例)     cordova plugin add cordova-plugin-camera3,刪除外掛(以camera外掛為例)    cordov

ionic+cordova開發

cordova 模板 all node tails AS 開發 pre 安裝 這裏是一些學習的過程中紀錄的: 參考文章: https://blog.csdn.net/xyzz609/article/details/52037044 首先是:安裝好 Node: 安裝:n

Vue + quasar-framework進行Vue混合app開發Cordova外掛呼叫(二)

開發一個App,怎麼能不呼叫原生的api介面呢,在Quasar中我們可以直接安裝並使用Cordova外掛呼叫原生裝置API,比如獲取裝置資訊,網路資訊,呼叫攝像頭等等。 Cordova外掛只有在deviceready事件被觸發後才可用。 我們不需要擔心太多。 在這個事件被觸發之後,Qua

ionic新增cordova外掛-NativeAudio

NativeAudio Cordova / PhoneGap 3.5 +本地音訊播放,針對HTML5遊戲和音訊應用所需的最小延遲,復調和併發。 cordova plugin add cordov

Ionic+Cordova開發環境搭建

Ionic+Cordova的組合是一個跨平臺的移動開發框架,屬於HybirdApp開發模式。其中Ionic是一個前端框架,集成了AngularJs在裡面,有很好很漂亮的UI控制元件。Cordova本身就是一個跨平臺的移動開發框架,可以將應用打包成各個平臺下的應用。他們之間的

Ionic自定義外掛開發(附Demo)

前言 ionic是目前比較火的一個移動端混合開發框架.其中外掛開發是其實現混合開發的主要方式.這裡我就大概記錄下自己自定義外掛的一些心得.如有不好之處,還望各位看官指出。 建立自定義外掛 1.安裝plugman,該工具主要用於建立一個自定義的外掛 npm in

wex5 cordova直播推流與播放器外掛開發

1.android開發可實現功能的原生程式碼(能執行不會程式崩潰,不然後期在wex5中的h5頁面中js呼叫原生程式碼的時候會一直在jni_onload程式無反應)2.配置外掛檔案建立如下圖的目錄libs檔案中放外掛需要的依賴包等,res裡面存放的是android的原生程式碼中

ionic 呼叫自定義cordova外掛

ionic 作為一個跨平臺h5框架,收到越來越多的開發人員的歡迎,如何通過ionic去呼叫原生開發的SDK?可以通過 js 呼叫cordova 外掛的方式來實現。本文通過一個簡單的例子程式,來實現通過ionic 來呼叫 原生介面。該例子通過網頁開啟原生的的一個UIViewC

ionic新增cordova外掛-Device

Device 獲取裝置相關資訊,如平臺、裝置模型。 cordova plugin add cordova-plugin-device Example module.controller(