Adobe PhoneGap

Adobe PhoneGap

Basisdaten

HauptentwicklerJoe Bowser, Michael Brooks, Rob Ellis, Dave Johnson, Anis Kadri, Brian Leroux, Jesse MacFadyen, Filip Maj, Eric Oesterle, Brock Whitten, Herman Wong, Shazron Abdullah
EntwicklerAdobe Inc.
Aktuelle Version9.0.0[1]
(10. Oktober 2019)
BetriebssystemiOS, Android, webOS, Symbian OS, Blackberry, Windows Phone, Windows 8
Programmier­spracheJavaScript
LizenzApache-Lizenz 2.0[2]
build.phonegap.com

Adobe PhoneGap (früher PhoneGap) ist ein Framework zur Erstellung hybrider Applikationen für mobile Endgeräte. PhoneGap wurde ursprünglich vom Unternehmen Nitobi entwickelt, das 2011 von Adobe Inc. übernommen wurde.[3] Im August 2020 teilte Adobe mit, die Weiterentwicklung von PhoneGap einzustellen. Der zugehörige Cloud-Build-Dienst PhoneGap Build wird zum 1. Oktober 2020 beendet.[4]

PhoneGap ermöglicht es, Anwendungssoftware für mobile Endgeräte mit JavaScript, HTML5 und CSS3 zu schreiben, anstelle von gerätespezifischen Programmiersprachen wie Swift oder Java. Die dabei entstehenden Applikationen sind hybride Applikationen; sie sind weder native Applikationen, weil das Layout mittels Webtechnologien und nicht mit nativen User Interface Frameworks geschrieben wird, noch sind sie webbasierte Applikationen, da sie als Apps über die Verkaufsportale der Betriebssystemhersteller verteilt werden können und auf die Programmierschnittstellen der Betriebssysteme der Endgeräte zugreifen können.[5] Ab der Version 1.9 ist es sogar möglich, frei native und hybride Codeteile zu mischen.

PhoneGap baut auf Apache Cordova auf,[6] welches von Adobe/Nitobi der Apache Software Foundation gespendet wurde.[7] Apache Cordova hieß ursprünglich ebenfalls PhoneGap, musste aber aus rechtlichen Gründen umbenannt werden, da für Apache-Projekte aus markenrechtlichen Gründen keine bereits belegten Namen verwendet werden dürfen.[7] Es wurde zunächst Apache Callback genannt und später in Apache Cordova umbenannt.[7][8] Bei Adobe Systems taucht es auch als Adobe PhoneGap und Adobe PhoneGap Build auf.[9]

PhoneGap wurde für die Erstellung vieler mobiler Applikationen verwendet, auf der PhoneGap-Website werden 1.890 in den diversen Online Stores vertriebene gelistet.[10] Apple Inc. hat bestätigt, dass das Framework auch mit den 4.0-Entwickler-Lizenzabkommen kompatibel ist.[11]

PhoneGap wird von verschiedenen mobilen Applikationsplattformen wie ViziApps, Worklight,[12] Convertigo[13] appMobi und AppByYou verwendet. Die JavaScript-Bibliothek Sencha Touch ist ab der Version 2.3 kompatibel mit PhoneGap, wodurch eine vereinfachte Integration von APIs, wie Notifikation, Kontakte, Speicher oder Kamera möglich ist.

Geschichte

Erstmals vorgestellt und weiterentwickelt wurde PhoneGap während eines iPhoneDevCamp Events in San Francisco.[14] Bei der O’Reilly Media 2009 Web 2.0 Conference gewann PhoneGap den People’s Choice Award.[15]

Am 4. Oktober 2011 verkündete Adobe offiziell die Übernahme von Nitobi Software, der ursprünglich hinter der PhoneGap Entwicklung stehenden Firma.[16] Gleichzeitig wurde PhoneGap der Apache Software Foundation gespendet.

Frühe Versionen von PhoneGap benötigten einen Apple-Computer, um iOS-Applikationen, und einen Windows PC, um Windows-Mobile-Applikationen erstellen zu können. Seit September 2012 ermöglicht Adobes PhoneGap Build Service das Hochladen von PhoneGap-Applikationen in Form von HTML-, CSS- und JavaScript-Sourcecode in einen sogenannten „Cloud compiler“, der die Applikationen für alle unterstützten Plattformen generiert.[17]

Vorgehensweise

PhoneGap-Applikationen verwenden HTML5 und CSS3 für die Darstellung und JavaScript für die Programmlogik. Obwohl HTML5 Zugriff auf mobile Technologien wie Beschleunigungssensor, Kamera und GPS ermöglicht, wird HTML5 noch nicht gleichmäßig für alle mobilen Browser, speziell für ältere Androidversionen, angeboten. Um diese Beeinträchtigungen zu vermeiden, bettet das PhoneGap-Framework HTML5-Code in einer nativen WebView mittels Foreign Function Interface ein. Damit können die nativen APIs der Geräte direkt angesprochen werden.[18]

PhoneGap kann auch mit nativen Plug-ins, welche den Entwicklern per JavaScript aufrufbare Funktionalitäten zur Verfügung stellen, erweitert werden.[19] PhoneGap stellt bereits Plug-ins für den Zugriff auf Kontakte und Termine, Benachrichtigungen, Locale des Benutzers, Speicher und Dateien, Device- und Verbindungsinformationen, Splash Screen, In-App-Browser, Beschleunigungssensor, Kamera, Ton-, Bild- und Videoaufnahme und -abspielung, Kompass und GPS zur Verfügung.

Durch die Verwendung der webbasierten Technologien werden PhoneGap-Applikationen unter Umständen langsamer als native Applikationen mit gleichartiger Funktionalität.[20] Adobe Systems warnt davor, dass mit PhoneGap entwickelte Applikationen möglicherweise von Apple, auf Grund ihrer geringen Geschwindigkeit oder weil sie sich nicht „nativ genug“ anfühlen, nicht akzeptiert werden.[21][22]

Unterstützte Plattformen

PhoneGap unterstützt derzeit die Entwicklung für die Betriebssysteme Apple iOS, Google Android, LG webOS, Microsoft Windows Phone, Blackberry und Tizen (SDK 2.x).[23]

Erweiterungen von PhoneGap für andere Betriebssysteme und Versionen sind geplant oder werden von anderen Herstellern angeboten. Unterstützt wird unter anderem Nokia Symbian OS[24], Bada.[25]

Die folgende Tabelle zeigt, welche für Mobile Devices typischen Fähigkeiten je Betriebssystem von PhoneGap unterstützt werden:[26]

Fähigkeitenbis iPhone 3Gab iPhone 3GSAndroidWindows PhoneBlackBerry 10, PlayBook OSBlack Berry 4.6–4.7Black Berry 5.x–6.0+BadaSymbianwebOSTizen
BeschleunigungssensorJaJaJaJaJaNeinJaJaJaJaJa
KameraJaJaJaJaJaNeinJaJaJaJaJa
KompassNeinJaJaJaJaNeinNeinJaNeinJaJa
KontakteJaJaJaJaJaNeinJaJaJaNeinJa
DateienJaJaJaJaJaNeinJaNeinNeinNeinJa
GeolocationJaJaJaJaJaJaJaJaJaJaJa
MedienJaJaJaJaJaNeinNeinNeinNeinNeinJa
NetzwerkJaJaJaJaJaJaJaJaJaJaJa
Benachrichtigungen (Alarm, Ton, Vibration)JaJaJaJaJaJaJaJaJaJaJa
SpeicherJaJaJaJaJaNeinJaNeinJaJaJa

Plugins

Cordova stellt eine Schnittstelle für Plug-ins zur Verfügung. Damit können Funktionen von Betriebssystem abhängige Bibliotheken aufgerufen werden. Die Funktion kann mittels JavaScript aufgerufen werden. Dabei werden Callback-Funktionen, die bei Erfolg und bei Fehlern aufgerufen werden, mitgegeben. Im folgenden Beispiel heißt das Plugin „mein_web_telefon“, die Funktion, die ausgeführt werden soll, lautet „anrufen“. In einem Array können Parameter übergeben werden. Im folgenden Beispiel wird die Telefonnummer, die URL des Telefon-Servers, Benutzer und Passwort übergeben um eine Voice-over-IP-Verbindung herzustellen. Bei Erfolg wird eine Javascript Funktion aufgerufen die die Nachricht „Ich wähle schon wie der Teufel!“ anzeigt. Im Fehlerfall wird die Fehlermeldung angezeigt.

Beispiel eines Aufrufs mittels Javascript:

 cordova.exec(function(Parameter) {alert('Ich wähle schon wie der Teufel!');},
                 function(error) {alert('Fehler: ' + error);},
                 "mein_web_telefon",
                 "anrufen",
                 ["099 111 22 33", "sip://meine_telefonanlage.com", "mein_benutzer", "mein_password"]);

Die Definitionen der Schnittstellen zum eigentlichen Plugin müssen sich in einer Javascript-Datei im Unterverzeichnis „www“ befinden. Oftmals wird als Name „index.js“ gewählt, dies ist aber keine Voraussetzung. Auch mehrere Javascript-Dateien können diese Aufgabe übernehmen.

Das eigentliche Plugin muss für das jeweilige Betriebssystem separat programmiert werden, da es wie im vorgenannten Beispiel ja Socket-Verbindungen zum Telefon-Server herstellen muss. Aufgrund der Limitierungen eines Webbrowsers (Und ein Webview ist ein Webbrowser ohne Benutzer-Interaktion), kann ein Webview keine UDP, TLS- bzw. TCP/IP-Verbindungen zum Telefonserver errichten. Diese Funktionalität muss das Plugin liefern. Und zwar in der jeweiligen Technologie des Betriebssystems. Bei Android wird zumeist ein Plugin in Java geschrieben, da jedes Android Telefon, bzw. jedes Android Pad Java Programme und Bibliotheken ausführen kann. Natürlich könnte man eine WebSocket-Verbindung zum Telefon-Server aufbauen. Im Beispiel wird aber angenommen, dass die Cordova-App Telefonanlagen bedienen soll, die über keine WebRTC Technologie verfügen. Anschließend ein nicht lauffähiges Beispiel um ein Plugin zu veranschaulichen. Das Beispiel verwendet „linphone“ als RTC und SIP-Bibliothek.

 // Hier werden die cordova spezifischen Klassen importiert
import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaInterface;
import org.apache.cordova.CordovaPlugin;
import org.apache.cordova.CordovaWebView;
// Hier werden einige Klassen für JSON importiert
import org.json.JSONArray;
import org.json.JSONException;
// Hier werden einige Klassen einer Telefon API eingebunden. Im Beispiel linphone
import org.linphone.core.Core;
import org.linphone.core.ProxyConfig;
import org.linphone.mediastream.Log;
// Die Klasse  vererbt von CordovaPlugin
public class mein_web_telefon extends CordovaPlugin
{
    public static Linphone mInstance;
    public static LinphoneMiniManager mLinphoneManager;
    public static Context mContext;
    ...
   @Override
    public void initialize(CordovaInterface cordova, CordovaWebView webView)
	{
        super.initialize(cordova, webView);
        this.cordova = cordova;
        mContext = cordova.getActivity().getApplicationContext();
        mLinphoneManager = new LinphoneMiniManager(mContext);
	...
    }
    //Die wichtige Funktion. Sie wird vom Javascript mit cordova.exec aufgerufen
    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException
	{
        switch (action)
		{
			case "anrufen":

				mLinphoneManager.call(args.getString(0), args.getString(1), callbackContext);
				return true;
			case 'logon"
			....
		}
	}
}

Das Beispiel ist sehr vereinfacht und nicht lauffähig. Zuerst müsste das Plugin eine Verbindung zum Server herstellen, bevor es einen Anruf tätigen kann. Um die Funktionalität auch IOS Geräten zur Verfügung zu stellen müsste man eine ähnliche Bibliothek in Object-C oder Swift für das Apple Betriebssystem erstellen.

Damit das Plugin erfolgreich zum Beispiel mit „cordovar plugin add d:\\mein_web_telefon“ in ein Cordova Projekt hinzugefügt werden kann, muss sich im Stamm Verzeichnis eine Datei mit dem Namen „plugin.xml“ befinden. In dieser XML-Datei werden die Dateien aufgeführt, welche das Plugin für die verschiedenen Betriebssysteme benötigt. Auch Zugriffsrechte wie z. B. der Zugriff auf die Kamera müssen hier deklariert werden.

<?xml version="1.0" encoding="utf-8"?>
<plugin id="mein_web_telefon" version="1.1.4" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">
  <name>Mein fantastisches Telefon Plugin</name>
  ...
  <!-- android -->
  <platform name="android">
   <config-file target="AndroidManifest.xml" parent="/manifest">
      <uses-permission android:name="android.permission.RECORD_AUDIO" />
      <uses-feature
          android:name="android.hardware.camera"
          android:required="false" />
      <uses-feature
          android:name="android.hardware.camera.autofocus"
          android:required="false" />
    </config-file>
    <config-file target="config.xml" parent="/*">
      <feature name="Linphone">
        <param name="android-package" value="com.sip.linphone.Linphone" />
      </feature>
    </config-file>
    ...
    <source-file src="src/android/src/Linphone.java" target-dir="src/com/sip/linphone" />
    ...
  </platform>

  <!-- ios -->
  <platform name="ios">
   <config-file target="config.xml" parent="/*">
      <feature name="Linphone">
        <param name="ios-package" value="Linphone"/>
      </feature>
    </config-file>
    <header-file src="src/ios/Linphone.h"/>
    <source-file src="src/ios/Linphone.m"/>
    <header-file src="src/ios/libs/apple-darwin/include/" />
    ...
    <source-file framework="true" src="src/ios/libs/apple-darwin/lib/mediastreamer/plugins/libmsamr.a" target-dir="lib/mediastreamer/plugins" />
    ...
  </platform>
</plugin>

Im Beispiel wird „android“ und „ios“ definiert mit den entsprechenden Dateien die das Plugin benötigt. Im Falle von „android“ handelt es sich um „.java“ Dateien, im Falle von „ios“ um „.h“ und „.m“ Dateien. Wie man sehen kann, werden die Quellcode Dateien und weitere Dateien im Verzeichnis „src“ abgelegt getrennt nach „android“ und „ios“. Für diese zwei Betriebssysteme ist das Plugin geeignet.

Siehe auch

  • Electron – ebenfalls ein Framework zur plattformunabhängigen Anwendungsentwicklung mit JS, HTML5 und CSS, jedoch für Desktop- statt Mobile-Anwendungen
  • Vaadin TouchKit – Framework für die Erstellung endgeräteunabhängiger mobiler Applikationen in Java. Basiert ebenfalls auf Apache Cordova

Literatur

  • Jeff Pelletier: Mobile App Manual: The Blueprint. 1. Auflage. Withinsight Publishing, 2013, ISBN 978-0-9890721-0-6 (englisch, mobileappmanual.com [abgerufen am 25. Oktober 2013]).
  • John M. Wargo: PhoneGap Essentials: Building Cross-Platform Mobile Apps. 1. Auflage. Addison-Wesley Professional, 2012, ISBN 978-0-321-81429-6 (englisch, phonegapessentials.com [abgerufen am 25. Oktober 2013]).
  • Jamie Munro: 20 Recipes for Programming PhoneGap: Cross-Platform Mobile Development for Android and iPhone. 1. Auflage. O’Reilly Media, 2012, ISBN 978-1-4493-1954-0 (englisch, oreilly.com [abgerufen am 25. Oktober 2013]).
  • Joshua Marinacci: Building Mobile Applications with Java: Using the Google Web Toolkit and PhoneGap. 1. Auflage. O’Reilly Media, 2012, ISBN 978-1-4493-0823-0 (englisch, oreilly.com [abgerufen am 25. Oktober 2013]).
  • Rohit Ghatol: Beginning PhoneGap: Mobile Web Framework for JavaScript and HTML5. 1. Auflage. 2011, ISBN 1-4302-3903-4 (englisch, apress.com [abgerufen am 25. Oktober 2013]).
  • Thomas Myer: Beginning PhoneGap. 1. Auflage. Wrox Press, 2011, ISBN 1-118-15665-X (englisch, wiley.com [abgerufen am 25. Oktober 2013]).
  • Ralph Steyer: Apps mit PhoneGap entwickeln. 1. Auflage. Carl Hansa Verlag, München 2013, ISBN 978-3-446-43510-0 (hanser-fachbuch.de).
Commons: Adobe PhoneGap – Sammlung von Bildern, Videos und Audiodateien

Einzelnachweise

  1. github.com. (abgerufen am 26. März 2020).
  2. PhoneGap License (Memento desOriginals vom 17. Juni 2011 im Internet Archive)  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/www.phonegap.com
  3. Adobe Announces Agreement to Acquire Nitobi, Creator of PhoneGap. Adobe.com, 3. Oktober 2011, archiviert vom Original am 13. April 2012; abgerufen am 13. März 2024.
  4. Christian Liebel: Adobe stellt PhoneGap ein: Drama oder Chance? Heise Developer, 12. August 2020, abgerufen am 15. August 2020.
  5. Marcus Ross: Cross-Plattform-Apps mit PhoneGap entwickeln. Heise Developer, 13. August 2013, abgerufen am 25. Oktober 2013.
  6. Apache Cordova gets a new look - The H Open Source: News and Features. H-online.com, 22. Februar 2012, abgerufen am 7. April 2012.
  7. a b c Brian: PhoneGap, Cordova, and what’s in a name? In: PhoneGap Blog. PhoneGap, 22. März 2012, abgerufen am 25. Oktober 2013 (englisch).
  8. Brian LeRoux: finding a new name that isn’t PhoneGap. org.apache.incubator.callback-dev, 28. Oktober 2011, archiviert vom Original (nicht mehr online verfügbar) am 15. August 2012; abgerufen am 25. Oktober 2013 (englisch).  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/markmail.org
  9. Adobe PhoneGap Build. Adobe Systems Inc., archiviert vom Original (nicht mehr online verfügbar) am 9. Februar 2014; abgerufen am 25. Oktober 2013 (englisch).  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/build.phonegap.com
  10. PhoneGap Apps. Phonegap.com, abgerufen am 25. Oktober 2013 (englisch).
  11. Jesse: PhoneGap and the Apple developer license agreement. Phonegap.com, 14. April 2010, archiviert vom Original (nicht mehr online verfügbar) am 15. April 2012; abgerufen am 25. Oktober 2013 (englisch, In no uncertain terms, my contacts at Apple have assured me that "PhoneGap is not in violation of the 3.3.1 clause of the license agreement.").  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/www.phonegap.com
  12. Ron Perry: How PhoneGap plays an important part in our Enterprise offering. Phonegap.com, 27. Juni 2011, archiviert vom Original (nicht mehr online verfügbar) am 15. April 2012; abgerufen am 25. Oktober 2013 (englisch): „At Worklight, we are not regular PhoneGap users: rather than developing PhoneGap-based apps, we have embedded PhoneGap into our enterprise-oriented mobile platform, and are fully exposing the PhoneGap APIs to our customers.“  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/www.phonegap.com
  13. Capulet: Convertigo Mobilizer Uses PhoneGap Build APIs. 7. Juli 2011, archiviert vom Original (nicht mehr online verfügbar) am 22. Januar 2014; abgerufen am 25. Oktober 2013 (englisch): „One of the exciting features of Convertigo Mobilizer is the ability to build cross platform native applications on iOS, Android, and BlackBerry. This features was made possible by integrating PhoneGap Build APIs in the Convertigo Server.“  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/phonegap.com
  14. Darryl K. Taft: PhoneGap Simplifies iPhone, Android, BlackBerry Development. Eweek.com, 13. März 2009, abgerufen am 25. Oktober 2013 (englisch): „Ellis said the idea for the PhoneGap technology came out of an iPhoneDevCamp event in San Francisco.“
  15. Davis Lidija: PhoneGap: People’s Choice Winner at Web 2.0 Expo Launch Pad. Readwriteweb.com, 2. April 2009, abgerufen am 25. Oktober 2013 (englisch).
  16. Stephen Shankland: Adobe buys PhoneGap, TypeKit for better Web tools. News.cnet.com, 3. Oktober 2011, abgerufen am 25. Oktober 2013 (englisch).
  17. Klint Finley: Adobe Launches Hosted PhoneGap Build Service For Creating Cross-Platform Mobile Apps. TechCrunch, 24. September 2012, abgerufen am 25. Oktober 2013 (englisch).
  18. Prital Shah, Jacques Bourhis, Kaining Yuan, Rao Meghana S: The Development of Mobile Applications using HTML5 and PhoneGap* on Intel Architecture-Based Platforms. Intel Corporation, 22. Juni 2012, abgerufen am 26. Oktober 2013 (englisch): „However, HTML5 has some limitations. Most prominent, is the lack of API to access device hardware and sensors such as accelerometer, compass, GPS, etc. While native applications can access device hardware, they lack the portability that web apps provide. Thus, a solution is to code a hybrid application, which cumulatively uses the benefits of native and web apps.“
  19. Plugin Development Guide. In: PhoneGap Documentation. PhoneGap, abgerufen am 26. Oktober 2013 (englisch).
  20. Sapan Diwakar: Titanium vs Phonegap vs Native application development. 21. Juni 2012, abgerufen am 8. August 2014 (englisch).
  21. Andrew Trice: PhoneGap advice on dealing with Apple application rejections. Adobe Inc., 29. Oktober 2012, abgerufen am 26. Oktober 2013 (englisch).
  22. Greg Avola: Creating apps with PhoneGap: Lessons learned. Adobe Inc., 17. September 2012, abgerufen am 26. Oktober 2013 (englisch): „When you add more complex CSS3 elements, heavy transitions, and supporting multiple devices (such as iOS and Android), however, it makes you realize that there are few steps you must iron out to prevent hair loss“
  23. PhoneGap Documentation: PhoneGap Platform Guides. PhoneGap, abgerufen am 25. Oktober 2013 (englisch).
  24. Jeremiah Cohick: Using PhoneGap and the Sony Ericsson WebSDK to develop Android apps. Android and Me, 15. Dezember 2009, abgerufen am 25. Oktober 2013 (englisch).
  25. PhoneGap Build. Adobe, archiviert vom Original (nicht mehr online verfügbar) am 23. Oktober 2020; abgerufen am 25. Oktober 2013 (englisch, siehe Grafik).  Info: Der Archivlink wurde automatisch eingesetzt und noch nicht geprüft. Bitte prüfe Original- und Archivlink gemäß Anleitung und entferne dann diesen Hinweis.@1@2Vorlage:Webachiv/IABot/build.phonegap.com
  26. Phonegap.com: PhoneGap Supported Features. Adobe, abgerufen am 25. Oktober 2013 (englisch).

Auf dieser Seite verwendete Medien

Yes check.svg
Cyan check mark () icon on a transparent background. Slight gradient between "Green30" (#14866D) and "Green50" (#00AF89)
Red x.svg
Red "X"/Cross logic icon.