2016-05-15 17 views
2

Ich befolgte die Anweisungen von dieser Seite, http://moduscreate.com/writing-a-cordova-plugin-in-swift-for-ios/, um meine eigenen Cordova Plugins für die iOS Plattform zu erstellen. Zuerst habe ich plugman installiert und ein neues Plugin erstellt. Das ist mein plugin.xml:Ein Cordova/Ionic Plugin in Swift schreiben

<?xml version='1.0' encoding='utf-8'?> 
<plugin id="com-moduscreate-plugins-echoswift" version="0.0.1" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android"> 
<name>ModusEchoSwift</name> 
<js-module name="ModusEchoSwift" src="www/ModusEchoSwift.js"> 
    <clobbers target="modusechoswift" /> 
</js-module> 
<platform name="ios"> 
    <config-file target="config.xml" parent="/*"> 
     <feature name="ModusEchoSwift"> 
      <param name="ios-package" value="ModusEchoSwift" /> 
     </feature> 
    </config-file> 
    <source-file src="src/ios/ModusEchoSwift.swift" /> 
</platform> 
</plugin> 

Hier meine js-Datei für das Plugin ist, das heißt ModusEchoSwift.js:

var exec = require('cordova/exec'); 
exports.echo = function(arg0, success, error) { 
    exec(success, error, "ModusEchoSwift", "echo", [arg0]); 
}; 
exports.echojs = function(arg0, success, error) { 
    if (arg0 && typeof(arg0) === 'string' && arg0.length > 0) { 
     success(arg0); 
    } else { 
     error('Empty message!'); 
    } 
}; 

Und das ist meine Mutter Swift-Klasse, das heißt ModusEchoSwift.swift:

@objc(ModusEchoSwift) class ModusEchoSwift : CDVPlugin { 
func echo(command: CDVInvokedUrlCommand) { 
    var pluginResult = CDVPluginResult(
     status: CDVCommandStatus_ERROR 
    ) 

    let msg = command.arguments[0] as? String ?? "" 

    if msg.characters.count > 0 { 
     /* UIAlertController is iOS 8 or newer only. */ 
     let toastController: UIAlertController = 
      UIAlertController(
       title: "", 
       message: msg, 
       preferredStyle: .Alert 
      ) 

     self.viewController?.presentViewController(
      toastController, 
      animated: true, 
      completion: nil 
     ) 

     let duration = Double(NSEC_PER_SEC) * 3.0 
     dispatch_after(
      dispatch_time(
       DISPATCH_TIME_NOW, 
       Int64(duration) 
      ), 
      dispatch_get_main_queue(), 
      { 
       toastController.dismissViewControllerAnimated(
        true, 
        completion: nil 
       ) 
      } 
     ) 

     pluginResult = CDVPluginResult(
      status: CDVCommandStatus_OK, 
      messageAsString: msg 
     ) 
    } 

    self.commandDelegate!.sendPluginResult(
     pluginResult, 
     callbackId: command.callbackId 
    ) 
    } 
} 

Dies sind die Dateien in meinem Plugin. Jetzt versuche ich eine einfache Warnung mit diesem Plugin in meinem ionischen Projekt zu zeigen. Ich habe eine einfache index.html gerade jetzt, wo ich die Warnung will zeigen, hier ist sie:

<ion-pane> 
    <ion-header-bar class="bar-stable"> 
    <h1 class="title">Ionic Blank Starter</h1> 
    </ion-header-bar> 
    <ion-content> 
    <div ng-controller="myController"> 
     Hello {{user}} 
     </div> 
    </ion-content> 
</ion-pane> 

Und hier ist mein Controller:

.controller('myController', function($scope){ 
console.log("Ok"); 
$scope.user = "kAy"; 
ModusEchoSwift.echo('Plugin Ready!', function(msg) { 
    console.log("Success"); 
    }, 
    function(err) { 
    console.log("Error"); 
    } 
); 

})

Hier in dieser Controller bekomme ich immer wieder den Fehler, dass ModusEchoSwift nicht definiert ist, was ich nicht verstehe! Kann mir jemand sagen wie ich die Funktion meines Plugins in meinem bestehenden ionischen Projekt nutzen soll?

+0

Haben Sie die Datei cordova.js in Ihren HTML-Code aufgenommen? – Gandhi

+0

Ya ich habe, n ich denke nicht das ist das Problem –

+0

Ist Ihr Plugin in iOS-Plattform Plugins-Ordner enthalten? Ist Ihr benutzerdefinierter Plugin-Eintrag auch in Ihrem Projekt-Plugins-Ordner in der ios.json-Datei verfügbar? – Gandhi

Antwort

0

Ich bin der Autor des Blogs, dem du folgst, ich habe deinen ganzen Code, den du gepostet hast, überprüft und alles sieht korrekt aus. Es kann sein, dass Sie das Bridging-Header-Plugin noch nicht zu Ihrem Cordova App-Projekt hinzugefügt haben, auf das ich in meinem Beitrag (unten zitiert) Bezug nehme.

Kurz gesagt, ich denke, dass Sie das unten referenzierte Plugin hinzufügen müssen, das Ihnen helfen wird, sich mit dem Bridging-Header Objective C to Swift zu beschäftigen. Überprüfen Sie auch den Modus-Plugin und die Überbrückung eines korrekt installiert, von

cordova plugin ls 

In der App-Projekt Hauptordner (der mit config.xml darin) zu tun. Dies sollte sowohl das ModusEchoSwift- als auch das Bridging-Header-Plugin in seiner Ausgabe zurückgeben, wenn beide im App-Projekt korrekt installiert sind.

Die Cordova-Plugin, das wir gearbeitet haben in Swift implementiert, aber die einheimischen Teile eines Cordova iOS-App sind in Objective-C noch geschrieben. Normalerweise ist dies kein Code, der betreffen muss, da der Cordova CLI ihn automatisch zusammen mit einem Xcode-Projekt generiert und kompiliert.

Wenn Swift mit jedoch ein Plugin zu schreiben, wir brauchen die Cordova App Xcode Projekteinstellungen ändern unsere Swift Plug-Code Zugang zu ermöglichen, die Cordova Objekte, die es braucht, die in Objective-C geschrieben werden. Dazu verwenden wir eine Bridging-Header-Datei.

Eine Bridging-Headerdatei ist ein Objective-C-Header, der Importe für jeden Objective-C-Header enthält, auf den wir in unserem Swift-Code zugreifen möchten. In unserem Fall benötigen wir Zugriff auf einige der Cordova Objekte: CDVPlugin, CDVInvokedUrlCommand und CDVPluginResult für Beispiel.Dies bedeutet, dass unsere Überbrückung Header muss nur enthalten:

#import <Cordova/CDV.h> 

als unser Plugin keine anderen Objective-C Referenzen werden. CDV.h enthält Deklarationen für all diese und ist Teil jeder Cordova App, die das CLI generiert.

Unser Brückenkopf muss im Ordner Plattformen/ios/in unserer Cordova App (zum Beispiel für unsere TestApp dass wir dies wäre nächstes bauen werde Plattformen/ios/TestApp) leben. Außerdem muss in der Xcode-Projektdatei referenziert werden, damit Xcode weiß, dass dies ein Bridging-Header ist und dass das Objective-C-App-Projekt auch Swift-Code enthält, wenn die Anwendung kompiliert und verknüpft wird.

In Cordova sollte der Plattformordner idealerweise ein Build-Artefakt sein - , das vollständig durch Ausführen von Cordova CLI-Befehlen generiert wird. Wir sollten nicht bearbeiten oder Dateien manuell in diesem Ordner hinzufügen. Allerdings finden wir jetzt selbst, um den erforderlichen Überbrückungs-Header in das Xcode-Projekt einzufügen. Glücklicherweise unterstützt Cordovas CLI hooks, die es uns erlauben, Skripte vor oder nach bestimmten CLI Befehlen auszuführen, genau um mit solchen Situationen fertig zu werden.

Hook-Skripte können gebündelt und mit Plugins verteilt werden, so dass sie einfach zu teilen und zu Projekten hinzuzufügen sind. GitHub Benutzer Alexis Kofman schrieb ein praktisches Plugin, das ein Hook-Skript automatisch installiert erstellen die Bridging-Header, die wir brauchen und konfigurieren Sie das Xcode-Projekt zu verwenden Sie es. Sein Plugin kann here gefunden werden und wir verwenden es, wenn eine Test Cordova App konfigurieren, um unser Swift-Plugin mit zu starten.

Für weitere Informationen zum Mischen von Objective C und Swift im selben Projekt, empfehlen wir die Bezugnahme auf die Apple documentation zum Thema.

Bei der weiteren Untersuchung sieht es aus wie Sie nicht die Überbrückung Header-Plugin auf Ihren Test-App vor der Zugabe der ios Plattform oder die Swift-Plugin, diese Reihenfolge der Ereignisse nicht hinzugefügt wird benötigt, um die Überbrückung Header-Plugin Hook-Skript zu erhalten, Feuer zur richtigen Zeit.

Die folgende Reihenfolge der Befehle bekommt man auf eine funktionierende Anwendung von nichts, ich lief nur auf meinem lokalen Rechner triple-Check:

cordova create mytest 
cd mytest 
cordova plugin add cordova-plugin-add-swift-support --save 
cordova platform add ios --save 
cordova plugin add https://github.com/ModusCreateOrg/cordova-swift-plugin-example 
cordova build ios 
cordova emulate ios 
  • Let Emulator starten.
  • Herstellen einer Verbindung zum Emulator mithilfe des Safari-Remotedebuggers.
  • öffnen JS Konsole

In JS Console:

modusechoswift.echo('hello', undefined); 

Beachten Sie eine native 'Toast' mit 'Hallo' Nachricht erscheint aus dem Plugin im Simulator dann bald nach verschwinden. Screenshot beigefügt.enter image description here

+0

Vielen Dank !! Ich habe versucht, dies in Cordova und es scheint gut zu funktionieren. Aber die Sache ist, ich möchte dies in ionischen versuchen, und ich folgte der gleichen Methode für ionische Plattform, die nicht in ionischen arbeiten scheint! –

+0

Funktionieren Plug-ins so, wie Sie sie mit Ionic verwenden? Das Problem mag generischer sein, aber ich weiß sehr wenig über Ionic. –

+0

Andere Cordova Plugins wie Cordova-Plugin-Kamera, Cordova-Datei-Picker-Plugin scheint mit ionischen arbeiten. Und mein Projekt ist in Ionic gemacht, also muss ich dieses Cordova Plugin in ionischen arbeiten lassen. –

0

Normalerweise bedeutet der Fehler "Plugin nicht definiert", dass Sie das ModusCreate-Plugin über eine Angular service (Ionic baut auf AngularJS) verfügbar machen müssen. Cordova selbst verwendet kein Angular, weshalb das funktioniert, Ionic aber nicht. Es gibt ein paar Möglichkeiten, um den Service zu machen - ich würde für Beispiele auf ngCordova schauen. ngCordova ist sehr wahrscheinlich, wie cordova-plugin-camera schon Angular ausgesetzt ist.

Sobald Sie das getan haben, müssen Sie diesen Service in Ihren Controller injizieren (ähnlich wie $ scope bereits injiziert wird). Danach solltest du gut gehen. Ich hoffe, das hilft.

+0

Ya ich dachte das gleiche, Cordova Plugins funktionieren nicht in ionischen Plattform, sondern eher ngCordova Plugins arbeiten. So können Sie einige Tutorial Links verweisen oder erklären, wie mache ich dieses Cordova Plugin in ionischen arbeiten? –

+0

Siehe die Links, die ich für Beispiele postete. Die Grundidee ist jedoch, dass Sie ein neues Modul erstellen: z. angular.module ('modusCreateServiceModule', []) (die Klammern bedeuten, dass Sie eine neue erstellen). Dann wenden Sie sich an eine Service-Fabrik: z.B. angular.module ([...]) .factory ('$ ModusCreateSwift', [Abhängigkeiten gehen hier, dann Funktion, die definiert, was "echo" ist (Funktionsdefinition)]). Es ist eine nicht-triviale Aufgabe, weshalb ich auf ngCordova und die Angular-Services-Seite verweise. – JCooper

1

Rufsteuerung 'modusechoswift' nicht 'ModusEchoSwift' und sicher sein, Plattform

$ionicPlatform.ready(function() { 
    modusechoswift.echo('Plugin Ready!', function(msg) { 
     console.log("Success"); 
    }, 
    function(err) { 
     console.log("Error"); 
    } 
); 
}); 
2

bereitgestellt Dieses tut Arbeit korrekt mit ionischen v2.2.1 & cordova v6.5.0, bereit ist, die in Simons beschriebenen Schritte blog post Es folgt und mit einer geringfügigen Änderung: diese Codezeile hinzufügen in dem App.component.ts unterhalb der Importe Datei:

declare let modusechoswift; 

die Bridging-header.h Datei im Ioni c App war in meinem Fall unter "Andere Quellen". Simons Post bezieht sich auf einen anderen Ort, der mich anfangs abschreckte, aber es war kein Thema. In der Tat schien es keinen Effekt zu haben, diese Header-Datei irgendwo in meinem Xcode-Projekt zu bewegen. Ich schätze, XCode ist es egal, wo die Datei ist, solange sie vorhanden ist.

Verwandte Themen