Framework

Android- und iPhone-Apps selber entwickeln

16.1.2014 von Anna Kobylinska und Filipe Pereira Martins

Android- und iPhone-Apps erstellen leicht gemacht. Wir zeigen Ihnen die interessantesten Frameworks, mit denen Sie selber Apps entwickeln und programmieren können.

ca. 6:10 Min
Ratgeber
VG Wort Pixel
Apps selber entwickeln mit dem richtigen Framework
Die interessantesten Frameworks, mit denen Sie selber Apps entwickeln können.
© Internet Magazin

Android- und iPhone-Apps selber entwickeln mit HTML5, CSS3 und Javasricpt: Die Entstehung Cross-Plattformfähiger mobiler Anwendungen für iOS, Android OS, Windows Mobile, BlackBerry OS und andere als eine Zugabe zur Website ist immer öfter Thema. Denn die Besucher legen zunehmend Wert auf mobile Apps als eine Ergänzung zu oder einen Ersatz für mobile Webdienste. Das Interesse an Frameworks und Bibliotheken für die HTML5-basierte Webentwicklung wächst dadurch unaufhaltsam.

Als Webentwickler können Sie dank geeigneter Frameworks Ihr hart gewonnenes Know-how der Websprachen nutzen, um native mobile Apps für Smartphones und Tablets zu entwickeln. Die Wahl eines geeigneten Frameworks fällt allerdings alles andere als leicht.

Die Qual der Framework-Wahl

Ein geeignetes Entwicklungs-Framework bietet Ihnen die Möglichkeit, Ihre Websites und Webdienste mit einem vergleichsweise geringen Entwicklungsaufwand mit umfassenden Funktionen auszustatten. Nicht alle Frameworks bieten allerdings denselben Funktionsumfang oder können native Features der relevanten Zielplatformen gleichermaßen ansprechen.

Benutzer von Webdiensten und Web-Apps für Mobilgeräte mit einer berührungssensitiven Oberfläche haben recht hohe Anforderungen hinsichtlich des Bedienungskomforts der GUI. Die reibungslose Unterstützung von Touch-Ereignissen und die Verfügbarkeit animierter UI-Effekte zählen zu den wichtigsten Merkmalen einer gelungenen App.

Bezahlmethoden im Internet unter der Lupe

Allerdings gilt es zu beachten, dass eine emulierte Ereignisauswertung von Touch-Gesten die Reaktionsbereitschaft der GUI im Vergleich zur nativen Ereignisauswertung möglicherweise deutlich verlangsamt. Dennoch erwarten die Benutzer mobiler Webanwendungen eine realistisch animierte Bedienoberfläche. Verschiedene Frameworks haben diese Herausforderung unterschiedlich gelöst und bieten mehr oder weniger reizvolle Effekte.

Wir stellen Ihnen verschiedene Frameworks vor mit denen Sie Apps selber entwickeln und programmieren können. Im Hinblick auf die Kosten liegen die einzelnen Lösungen in der Praxis ziemlich weit auseinander. Einige Anbieter nutzen offenbar die kostenlose Version ihrer Frameworks als Köder und Testlabor zum Ausbügeln von Bugs, um dann mit der kostenpflichtigen Edition eigener Entwicklungstools oder -dienste durch astronomische Preise Geld zu scheffeln.


internet, webdesign, frameworks, apps, html5
Ripple, eine Chrome-Erweiterung für die (mobile Web-/App-) Entwicklung im Browser, und das Framework Tinyhippos gehören jetzt Research in Motion, dem Hersteller von Blackberry.
© Internet Magazin

Seien Sie daher auf der Hut. Mit einem günstigen kostenpflichtigen Framework sind Sie unter Umständen besser bedient als mit einer vermeintlichen Gratisversion, die dann möglicherweise mit versteckten Kosten aufwartet und Ihre Pläne aus der Bahn wirft. Zum Glück bietet sich reichlich Auswahl und es findet sich für jedes Budget eine geeignete Lösung.

LungoJS 1.2

Funktionsumfang: Entwicklung mobiler Web-Apps mit Unterstützung für Touch-Gesten, WebSQL, Browserverlauf, Geolocation, und vielem mehrPreis: kostenlos

internet, webdesign, frameworks, apps, html5
Hier ein Beispiel der Umsetzung eines Web-GUI mit LungoJS: Kitchensink.
© Internet Magazin

Bei LungoJS handelt es sich um ein mobiles Framework zur Entwicklung HTML5- basierter Apps für iOS, Android, Blackberry und Windows Phone 7. LungoJS erzeugt semantisches Mark-up und versteht sich auf die Auswertung von Touch- Ereignissen wie Wischbewegungen, die dynamische Handhabung des Ausrichtungswechsels des Displays, WebSQL, und Geolocation. Außerdem können Sie damit den Browserverlauf in Ihren Apps nutzen.

Alle UI-Elemente sind vektorbasiert, so dass die Darstellungsqualität unabhängig von der Auflösungsdichte des Displays gewährleistet ist. Das Framework lässt sich mit Hilfe der so genannten Sugars erweitern. Die resultierenden Apps können Sie sowohl über Ihre eigene Website als auch über die offiziellen Distributionskanäle vertreiben.

Jo

Funktionsumfang: Entwicklung von mobilen Apps auf Basis von HTML5 und CSS3 (keine Websites)Preis: kostenlos

internet, webdesign, frameworks, apps, html5
Eine Beispiel-App auf Basis des Jo-App-Frameworks auf einem Android-Smartphone.
© Internet Magazin

Jo ist ein flexibles Javascript-Framework zur Entwicklung von Web-Apps auf Basis von HTML5 und CSS3 unter Verwendung von pseudonativen Widgets und UI-Elementen. Jo unterstützt sowohl ein striktes Model-View-Controller-(MVC)-Paradigma als auch Modulmuster und andere Konstrukte. Die konsistente und modulare Ereignisauswertung resultiert in einer einfachen Wartung des Codes. Jo manipuliert das DOM unter Verwendung von className-Eigenschaften. Dadurch können Sie nicht nur das Aussehen Ihrer mobilen App sondern auch animierte Interaktionen mit dem Benutzer mit Hilfe dieses Frameworks leicht beeinflussen.

Um Ihren Apps ein individualisiertes Aussehen zu verleihen, müssen Sie lediglich einmal zentral das CSS anpassen. Jo geht sparsam mit den Ressourcen der Zielgeräte um und ist kompatibel mit Phonegap. Interessante Beispiele zum Einsatz dieses Frameworks finden Sie unter joapp.com.

Joshfire 0.9.2 Developer Preview

Funktionsumfang: Entwicklung von Apps auf Basis von HTML 5, CSS3 und Javascript für Desktop-Browser, Smartphones und Tablets (iOS, Android OS), Google TV und Samsung TVPreis: kostenlos (MIT-Lizenz)

internet, webdesign, frameworks, apps, html5
Joshfire unter Windows 8: Popgram präsentiert die beliebtesten Instagram-Bilder auf einem virtuellen Leuchttisch.
© Internet Magazin

Joshfire bringt die Fähigkeit mit, Anwendungscode serverseitig auszuführen, um die Belastung des Mobilgeräts zu minimieren. Unter der Adresse factory.joshfire.com/ können Sie Ihre ersten Apps in der Cloud bauen.

Der Basisaccount ist kostenlos, dafür schlägt der bezahlte Account mit einem regelrecht astronomischen Preis von über 15.500 Euro (20.000 US-Dollar) plus Mehrwertsteuer pro Jahr Entwicklung zu Buche.

Phonegap

Funktionsumfang: Entwicklung von Apps für iOS, Android, Blackberry, Windows Phone, Medienwiedergabe sowie native Features wie Kamera, Kompass, Geolocation, Netzwerk, Audioaufnahme, Adressbuch und Benachrichtigungen einschließlich des VibrationsalarmsPreis: kostenlos

Mittels Phonegap können Sie Ihr Knowhow im Bereich HTML5, CCS3 und Javascript nutzen, um HTML5-basierte Apps als native Web-Apps zu verpacken. Mit Phonegap können Sie unter anderem einige native Funktionen der anvisierten Zielgeräte ansprechen, darunter das Accelerometer, die Kamera, den Kompass und das Netzwerk nutzen.

Neben den beiden führenden mobilen Plattformen Apple iOS, Google Android OS und Microsofts Windows Phone beherrscht Phonegap außerdem auch die Erstellung nativer Apps (wenn auch mit einigen Einschränkungen) für Exoten wie RIMs Blackberry, HPs Palm WebOS, Samsung Bada und Symbian (zuvor von Nokia, aktuell von Accenture).

Sproutcore

Funktionsumfang: Entwicklung von Webapplikationen und mobilen Web-Apps mit dem Leistungsumfang einer Desktop-AnwendungPreis: kostenlos (MIT-Lizenz)

internet, webdesign, frameworks, apps, html5
Der deutsche Dienst Bong.TV zählt zu den Vorzeigeprojekten für das Sproutcore-Framework.
© Internet Magazin

Sproutcore ist ein quelloffenes Framework zum Entwickeln anspruchsvoller Webdienste und mobiler Apps mit den Funktionen einer Desktop-Applikation und der Flexibilität einer Cloud-Lösung. Sproutcore diente als Grundlage für Apples Cloud-Dienst MobileMe, den Vorgänger der heutigen iCloud. Auf Basis von Sproutcore entstanden außerdem unter anderem iWork.com, eine Office-Suite für den Browser, Gemfury , ein Cloud-Server zur Bereitstellung von Ruby-Gems, und Bong.tv, ein beliebter Online- Videorecorder für das deutsche Fernsehen.

Webentwickler können dank Sproutcore hardwarebeschleunigte mobile Web-Apps schreiben, welche die Ablaufgeschwindigkeit und das Reaktionsvermögen gewöhnlicher Desktop-Applikationen erzielen, ohne harte Kompromisse bei der Bedienerführung einzugehen. Mit diesem Framework können Sie Touch-, Drag- und Pinch-Gesten sowie die automatische Erkennung der Display-Ausrichtung (die so genannte Rotation Awareness) unter iOS nativ unterstützen.

Appspresso 1.1.2

Funktionsumfang: Entwicklung von Apps für iOS und AndroidPreis: kostenlos

Appspresso ist ein kostenloses, hybrides Framework der koreanischen KT HiTEL Co., Ltd. zur Entwicklung mobiler Apps für iOS und Android. Die Unterstützung für Microsofts Windows Phone 8, RIMs Blackberry 10 und Samsungs Bada sei laut Anbieter in Entwicklung. Appspresso lässt sich unter anderem mit jQuery Mobile, Sencha, jQTouch und Jo erweitern und in Eclipse nutzen.

Das vermeintliche Highlight von Appspresso, nämlich die Fähigkeit dieses Frameworks, modifizierten Javascript-Code direkt in eine gerade laufende mobile App dynamisch einzufügen, könnte ein ernsthaftes Sicherheitsrisiko darstellen, vom Risiko externer Manipulationen Ihrer Apps ganz zu schweigen. Mit Appspresso wurde bereits eine Handvoll Apps Standardentwickelt, die meisten davon sind allerdings nur in Korea erhältlich.

Sencha Touch 2

Funktionsumfang: kostenloses Framework für mobile Apps auf Basis von HTML5 für iOS, Android und Blackberry mit kostenpflichtigen EntwicklungswerkzeugenPreis: Das Framework ist kostenlos; die Entwicklungswerkzeuge sind kostenpflichtig

internet, webdesign, frameworks, apps, html5
Hier ein Beispiel der Umsetzung eines Web-GUI mit LungoJS: Kitchensink.
© Internet Magazin

Sencha Touch ist ein leistungsfähiges Framework zur Entwicklung mobiler Webapps für iOS, Android OS, und Blackberry unter Verwendung von HTML5, CSS3 und Javascript. Sencha Touch unterstützt in der aktuellen Version 2 unter anderem HTML5-Video- und -Audiokomponenten, das localStorage-Element und flüssige, effektvolle CSS3- Animationen, adaptive Layouts, und baut auf der Bibliothek Ext JS 4 desselben Anbieters auf.

Unter Verwendung von Sencha Touch entstanden unter anderem VEU Feldkirch von Fusonic, die offizielle App für das Eishockey-Team aus Österreich, und Chefkoch.de von pixelhouse GmbH, eine App zum Austauschen von Kochrezepten.

Das Framework Sencha Touch 2 erhalten Sie vom Anbieter kostenlos; für die Entwicklungswerkzeuge werden Sie jedoch zur Kasse gebeten. Sencha Architect 2, eine grafische Entwicklungsumgebung zum Programmieren HTML5-basierter Desktop-Anwendungen und mobiler Apps, kostet 310 Euro (399 US-Dollar). Alleine das Eclipse-Plug-in schlägt mit 154 Euro (199 US-Dollar) zu Buche. Die gesamte Entwicklungsumgebung für kommerzielle Apps bedeutet eine Investition von mindestens 770 Euro (995 USDollar), und zwar pro Arbeitsplatz.

Mobello

Funktionsumfang: Entwicklung mobiler Apps für iOS und Android OS und standardskonformer WebsitesPreis: kostenlos

Mobello ist ein Framework zur Entwicklung von mobilen Apps und Websites auf Basis von HTML5 und CSS3. Die geräteunabhängige Ereignisauswertung unterstützt Touch-Ereignisse; die multitaskingfähige Laufzeitumgebung ermöglicht Ihren Benutzern eine störungsfreie Bedienung der App. Das Framework bringt über zwanzig individualisierbare UI-Komponenten mit, die das gesamte Spektrum an Benutzerinteraktionen abdecken. Im Lieferumfang des Frameworks finden Sie neben der Javascript-Bibliothek Mobello.js die Entwicklungsumgebung Mobello Studio 1.1.

Mobello Studio beinhaltet unter anderem einen grafischen Editor des Designs und Layouts, einen Javascript-Editor und -Debugger und einen Emulator der Zielgeräte. Mobello Studio weist eine Eclipsekompatible Plug-in-Architektur auf und interagiert mit Appspresso.

Nächste passende Artikel

aufmacher_babbel_handheld_Dialogue

Sprachen lernen mit dem…

Die 4 besten Sprachlern-Apps: Babbel, PONS…
 7 Tank-Apps im Vergleich

Geld sparen beim Tanken

7 Tank-Apps im Vergleich
shutterstock_1855281505

Gesund abnehmen per Smartphone

Fünf Apps fürs Intervallfasten im Test: Welche…
adobestock_232856995-fitness-smartphone

Sport-Apps

Trainings-Apps für Zuhause - Fitness ohne Studio
Heat it nutzt das Prinzip der Hyperthermie, also der konzentrierten Wärme, um die Schmerzen und das Jucken zu lindern.

Smartphone-Zubehör und Apps…

Smarte Outdoor-Gadgets und -Apps im Test

Vorräte in Speisekammer und…

6 Vorrats- & Einkaufslisten-Apps für iOS und…
Aufmacher VPN Apps

Acht Apps im Test

Wie gut sind VPN-Apps im Vergleich?
slack microsoft teams integration

Sichere Anwendungen?

Kritik an Sicherheit von Teams & Slack: "5-6 Jahre…
Überrasch’ mich!
mehrweniger

Mehr zum Thema

Wir haben neue HTML5-Tipps für Sie gesammelt.

HTML5-Ratgeber

Drag-und-Drop ohne Javascript und CSS - so geht's

jQuery Mobile - Tipps & Tricks für mobile Web-Apps.

Maßgeschneidert

jQuery Mobile - Tipps & Tricks für mobile Web-Apps

Wir haben CSS-Tipps für Darstellungsprobleme auf Tablets.

CSS-Tipps

Darstellungsprobleme auf Tablets beheben (Teil 2)

Internetrevolution mit Social Networks, Mobile Payment & Co.

Web-Trends 2013

Internetrevolution mit Apps, Social Networks, Mobile Payment…

CSS-Filter zählen sicher zu den spannendsten Features von CSS3.

CSS3-Ratgeber

Filter und faszinierende Effekte

Weiter zur Startseite