Category

Beim erstellen von WebApp kann man schnell an die Grenzen von JavaScript stossen, da der Browser nur einen limitierten Zugriff auf das Smartphone bietet. PhoneGap bietet dazu die Schnittstelle um auf das Gerät zuzugreifen.

PhoneGap stellt folgende Funktionen zur Verfügung:

Dies mag für manche App ausreichen, sobald man allerdings eine native Funktion benötigt, wird ein direkter Zugriff benötigt. PhoneGap bietet eine Lösung über sogenannte „Plugins“ an.

Diese Plugins werden immer mit demselben JavaScript-Code über die PhoneGap Schnittstelle aufgerufen. Das sieht dann in JavaScript so aus:
cordova.exec(pluginSuccess, pluginFail, "TestPlugin", "testAction", ["test"]);

Ich kann hier anmerken das PhoneGap und Cordova das selbe ist.

Der exec Funktion werden zwei Callbackfunktionen, der Plugin Name, die gewünschte Action und ein Array von Parametern übergeben, welche anschliessend der Action im Plugin geliefert werden.

Für jede Zielplattform muss das Plugin dann in der jeweiligen Programmiersprache implementiert werden. In den Pluginklassen kann dann grundsätzlich alles gemacht werden, was auch in der Nativeentwicklung möglich wäre. Sobald die Ausfühung des Plugins fertig ist, kann man den Programmlauf zurück zu den Callbackfunktionen im JavaScript senden. Eine solche Plugin Action könnte in Android wie folgt aussehen:
private void testAction(String message, CallbackContext callbackContext) {
  if (message != null && message.length() > 0) {
    callbackContext.success(message);
  } else {
    callbackContext.error("Expected one non-empty string argument.");
  }
}


Windows Phone 7/8:

public void testAction(string message) {
 if (message != null && message.Length > 0) {
     DispatchCommandResult(new PluginResult(PluginResult.Status.OK, message));
 }
 else {
     DispatchCommandResult(new PluginResult(PluginResult.Status.ERROR, "Error!"));
 }
}

iOS
- (void)testAction:(CDVInvokedUrlCommand*)command
{
CDVPluginResult* pluginResult = nil;
NSString* myarg = [command.arguments objectAtIndex:0];
if (myarg != nil) {
pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK];
} else {
pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_ERROR messageAsString:@"Arg was null"];
}
[self.commandDelegate sendPluginResult:pluginResult callbackId:command.callbackId]; }

Die fett markierten Funktionen sind hierbei die Aufrufe der Callbackfunktionen. Das Resultat kann somit zurück zum JavaScript gegeben werden, wo dieses verarbeitet wird. Beispiel von JavaScript Callbackfunktionen:

function pluginSuccess(message) {
// Success callback
 alert("Message:"+message);
}

function pluginFail(message) {
// Error callback
 alert("Error:" + message);
}


Unten sind die Ausgaben auf verschiedenen Geräten sichtbar:

(Windows Phone, Android, iOS)