2015-07-31 16 views
5

Sto usando quadro ionica per rendere android app .Sono avendo Cordova versione 5.1 .first creo un progetto utilizzando riga di comando ionici schede inizio myApp .Le aggiungo piattaforma Android .Ora ho bisogno di comunicare il codice Java per codice javascript. Usando google ho trovato che ho bisogno di creare plugin personalizzati. Ma non ho trovato nessuna soluzione su google come creeremo un plugin personalizzato. Ho trovato ng-cordova che danno il proprio plugin non possiamo personalizzare plugin.come chiamare la funzione in framework ionico + angularjs?

Mi serve solo un pulsante sulla UI .On click del tasto che ho bisogno di chiamare java funzione di stampa avendo un po 'di log su console .then tornare successo o callback di errore sul file JavaScript

potrebbe per favore dimmi come creeremo un semplice plugin in ionico?

risposta

15

Sì, i plugin cordova personalizzati sono dolorosi perché i documenti ufficiali non sono così grandi.

Prima di tutto abbiamo bisogno di capire una struttura di cartella personalizzata plug-in .

enter image description here

  1. involucro - nome che si vuole dare al vostro plugin
  2. src - cartella in cui il codice sorgente va
  3. Android - dal momento che siete alla ricerca di Android, una cartella di Android è richiesto
  4. www - contiene le funzioni javascript che chiamano il codice java. (utilizzando cordova)
  5. plugin.xml - il ver Il cuore del plugin, questo file configura il plugin (aggiungendo permessi, copiando file su piattaforme ecc.)

Nella cartella di Android creare un file CustomPlugin.java.

package com.example.myplugin; 

import org.apache.cordova.CallbackContext; 
import org.apache.cordova.CordovaPlugin; 
import org.json.JSONObject; 
import org.json.JSONArray; 
import org.json.JSONException; 

public class CustomPlugin extends CordovaPlugin { 

    @Override 
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException { 
    if ("beep".equals(action)) { 
     // print your log here... 
     callbackContext.success(); 
     return true; 
    } 
    return false; // Returning false results in a "MethodNotFound" error. 
    } 
} 

Ora abbiamo bisogno di costruire un'interfaccia tra javascript e codice java.

Cordova fornisce una funzione semplice per questo.

exec(<successFunction>, <failFunction>, <service>, <action>, [<args>]); 

creare un file nella cartella MycustomPlugin.jswww.

cordova.exec(successCallback, ErrorCallBack, "service","action", []); 

Vale la pena di sapere che,

servizio -> Nome della classe Java

azione -> azione vogliamo chiamare (in questo caso "bip" see above codice)

Your MycustomPlugin.il file js dovrebbe essere simile a questo:

var MyPlugin = { 
    PrintLog: function (successCallback, errorCallback, action) { 
    cordova.exec(
      successCallback, // success callback function 
      errorCallback, // error callback function 
      'CustomPlugin', // mapped to our native Java class called 
      action, // with this action name , in this case 'beep' 
      [] )// arguments, if needed 
    } 
} 
module.exports = MyPlugin; 

Infine è necessario configurare il file di plugin.xml

<?xml version="1.0" encoding="utf-8"?> 
    <plugin xmlns="http://www.phonegap.com/ns/plugins/1.0" 
      id="com.example.plugin" 
      version="0.0.1">   
     <name>Cordova Plugin</name> 

     <engines> 
     <engine name="cordova" version=">=3.4.0"/> 
     </engines> 

     <js-module src="www/MycustomPlugin.js" name="CustomPlugin"> 
     <clobbers target="window.MycustomPlugin" /> 
     </js-module>  
    <platform name="android"> 

     <config-file target="res/xml/config.xml" parent="/*"> 
      <feature name="CustomPlugin"> 
       <param name="android-package" value="com.example.myplugin.CustomPlugin"/> 
      </feature> 
     </config-file> 

     <source-file src="src/android/CustomPlugin.java" target-dir="src/com/example/myplugin"/>  

    </platform> 
</plugin> 

ora aggiungere questo plugin per il vostro progetto. myApp (quello creato) utilizzando cordova plugin add /path/to/your/custom/plugin

E in funzione di $ ionicPlatform.ready chiamo il tuo codice Java da JavaScript

window.MycustomPlugin.PrintLog(function(res){ 
    //success 
    }, function(err){ 
     //error 
    }, "beep") 
+0

Ciao, ma sto usando framwork ionico è un lavoro su ionico – user944513

+1

Sì, lo so, Ionic è costruito su cordova, quindi non importa. Funzionerà anche su ionico. Anche se vuoi andare più in dettaglio controlla questo http://devgirl.org/2013/09/17/how-to-write-a-phonegap-3-0-plugin-for-android/ –

+2

La migliore risposta! !! Hai semplificato il mio lavoro @KaranKumar – VizardCrawler

0

Ho trovato il vostro errore:

TypeError: Arguments to path.join must be strings 
    at Object.win32.join (path.js:233:13) 

Era corretto aggiungendo il tag di chiusura

</platform> 
</plugin> 
Problemi correlati