6.4.2 PhoneGap

Wie schon bei der Vorstellung von PhoneGap beschrieben, unterscheidet sich der Container, in den die Web-Anwendung eingesetzt wird, je nach Plattform. Deshalb ist dieses Protokoll nach Plattformen aufgeteilt.

Protokoll Android

Die Verwendung des PhoneGap-Android-Containers beginnt mit der Installation von Java, Eclipse, dem Android SDK, dem ADT Plugin für Android, Apache ANT und Ruby. Ist dies geschafft, muss mit einem Kommandozeilenbefehl aus der PhoneGap-Vorlage ein Android-Eclipse-Projekt erstellt werden. Dieser Kommandozeilenbefehl ist schlecht dokumentiert und fehleranfällig, was einiges an Nerven kosten kann.

Wird das erstellte Projekt in Eclipse geöffnet, um es im Android Emulator zu testen, wird dies mit einem Fehler abgelehnt. Zuerst muss die im lib-Ordner vorhandene Datei phonegap.jar zum Buildpath hinzugefügt werden.

Anschließend kann die jQTouch-Anwendung aus Abschnitt 6.4.1 in das Verzeichnis „assets/www“ des PhoneGap-Projekts kopiert und anschließend mit dem Android-Simulator betrachtet werden. Da PhoneGap nur einen WebView einbindet, der dem Browser des Geräts entspricht, funktioniert das einwandfrei.

Um der Anwendung ein Icon zu geben, muss an mehreren Stellen (verschiedene Auflösungen) die Datei icon.png angepasst werden. Es zeigt sich schon jetzt, dass die für den Start der Anwendung benötigte Zeit viel kürzer ist da die Daten lokal statt über die Internetverbindung des Geräts geladen werden. Der Startbildschirm der Anwendung ist ohne Internetverbindung im Smartphone nutzbar.

Um die von PhoneGap bereitgestellte Funktionalität nutzen zu können, muss nur die Datei phonegap.js wie in Quellcode 6.4 gezeigt im Header der Datei index.html eingebunden werden.

<script type="text/javascript" src="phonegap.js" charset="…"></script>

Quellcode 6.4: Einbindung von phonegap.js

Anschließend kann damit begonnen werden, die bisher noch fehlende Funktionalität der jQTouch-Anwendung nachzutragen.

Als erstes wird der Warnton implementiert, der ertönen soll, wenn ein Fehler bei der Abfrage der Unterkünfte auftritt oder keine Unterkünfte gefunden werden. Laut Dokumentation sollte diese mit der Funktion navigator.notification.beep() funktionieren, im Emulator ist jedoch kein Ton zu vernehmen. Eine kurze Recherche in der Community zu PhoneGap bringt die Lösung: navigator.notification.beep(1) bringt das Gerät zum Piepen.

Die Vibration beim Speichern von Favoriten ist ebenso problemlos zu implementieren, ein einfacher Aufruf von navigator.notification.vibrate(500) sorgt für eine halbe Sekunde lange Vibration.

Das Abfangen eines Schüttelevents ist nicht direkt mit PhoneGap möglich. Allerdings kann auf den Accelerometer-Sensor zugegriffen werden, der Daten über die Bewegung des Geräts abgibt. Unter Android ist leider kein Zugriff auf einen Accelerometer möglich und so gibt es kein Schüttelevent.

Protokoll iOS

Unter Mac OS X ist die Installation bis zur Nutzung von PhoneGap um einiges angenehmer. iOS SDK mit XCode herunterladen und installieren, im Terminal in den phonegap-iphone-Ordner navigieren und make ausführen. Es wird ein Installer erstellt, der alle benötigten Dateien anlegt und XCode konfiguriert. Danach kann direkt in XCode eine PhoneGap-Anwendung erstellt werden.

Die schon für Android-PhoneGap erweiterte jQTouch-Anwendung kann wieder in den Ordner „www/“ kopiert werden und funktioniert danach direkt im iPhone-Simulator. Um sie auf dem per USB angeschlossenen Gerät starten zu können, sind viele komplizierte Schritte nötig, dies ist jedoch bei iOS so üblich und nicht PhoneGap anzulasten.

Hier ist ein direkter Vergleich auf dem Gerät zwischen der „installierten“ jQTouch-Anwendung und der PhoneGap-Anwendung möglich. Die Startzeit ist von bisher ca. 7 auf ca. 5 Sekunden gesunken. Eine Internetverbindung ist nicht mehr notwendig.

Der unter Android noch funktionierende Ton ist auf dem iPhone nicht zu hören. Ein kurzer Blick in die Dokumentation von PhoneGap zeigt, dass hier eine Datei beep.wav ins www-Verzeichnis abgelegt werden muss, da iOS keinen eigenen Ton mitbringt. Ist diese Datei vorhanden, wird auch hier der Ton für Fehlermeldung abgespielt.

Für iOS ist Quellcode zum Auslesen de Bewegungssensors und Erkennen des Schüttelevents vorhanden, der in Quellcode 6.5 dargestellt ist.

function watchForShake(threshold) {
	var axl = new Accelerometer();
	axl.watchAcceleration(
		function (Accel)
		{
			if (true === Accel.is_updating) { return; }
			if (Accel.x >= threshold || Accel.x <= (0 - threshold)) {
				alert('shake');
			}
		}
		, function(){}
		, {frequency : 750}
	);
}

Quellcode 6.5: Schüttelevent unter iOS erkennen mit PhoneGap

Auch in iOS-PhoneGap kann ein eigenes Icon für die Anwendung definiert werden. Zusätzlich ist es hier möglich, wie schon bei der jQTouch-Anwendung, einen Ladebildschirm einzurichten, der angezeigt wird, während im Hintergrund die Anwendung lädt.

Protokoll Palm webOS

Die Entwicklung von PhoneGap-Anwendungen für Palm webOS ist theoretisch auch möglich. Allerdings ist der im Wiki von PhoneGap dokumentierte Prozess unter Windows nicht ohne Weiteres durchführbar. Dieser setzt auf verschiedene Linux-Tools, die unter Windows nicht verfügbar sind. In der Dokumentation und der Community finden sich keine Ansatzpunkte, wie dieses Problem zu lösen sein könnte. Deshalb wird hier abgebrochen.

Bewertung

PhoneGap ist die perfekte Ergänzung für eine Web-Anwendung. Es ermöglicht den Zugriff auf genau die Funktionen, die in der reinen jQTouch-Anwendung nicht möglich waren. Die Performance ist besser und durch den nativen Container verhält sich die Anwendung auch sonst mehr wie eine native Anwendung.

Die verstreute und teilweise falsche Dokumentation hat sich als wahrer Stolperstein herausgestellt. Wenn etwas nicht auf Anhieb wie beschrieben funktioniert kommt man damit kaum weiter. Die Community hingegen ist sehr aktiv und hilfreich.

Leave a Reply

Your email address will not be published. Required fields are marked *