Herzlich willkommen auf dem Blog der exensio GmbH

exensio ist ein unabhängiges Software-Unternehmen von erfahrenen IT Beratern und Architekten. Zu unseren Kunden zählen namhafte deutsche Großunternehmen.

exensio verbessert das Kommunikations- und Informationsmanagement von Unternehmen. Auf Basis sinnvoller und zweckmäßiger Technologien erarbeiten wir flexible und übergreifende Lösungen für webbasierte Informationssysteme. Abhängig von den Kundenanforderungen realisieren wir Web Applikationen sowie Lösungen auf Basis von Web Content Management- und Portalsystemen. Integrativ, wirtschaftlich und anwenderfreundlich!

Hier gelangen Sie zur exensio GmbH.

Montag, 23. Juni 2014

Hybride Mobile App für Claretportal

In unserer Blog-Serie "ClaretPortal wird mobil" haben wir gezeigt, wie eine Portal-Seite mit jQuery Mobile für mobile Endgeräte aufbereitet werden kann. Eine mobile App bietet einen weiteren komfortablen Zugang zu einer Anwendung. Die App kommuniziert dabei z.B. über eine JSON Schnittstelle mit der Anwendung, so dass immer überall die gleichen Daten vorliegen. Da Claretportal seit kurzem eine JSON Schnittstelle bietet, haben wir eine App für das iPad geschrieben, die diese Schnittstelle nutzt.
Eine solche App kann auf mehrere Arten umgesetzt werden. Neben dem "normalen" Weg eine iOS App mit Objectiv-C in Xcode zu erstellen, kann eine hybride App in Betracht gezogen werden. Als "hybride" werden Apps bezeichnet, die sich verhalten als wären sie eine echte native iOS App, aber nicht in Objektiv-C, sondern in HTML, JavaScript und CSS geschrieben sind. Das Framework Phonegap, dass auf Apache Cordova basiert, ermöglicht es gerätespezifische Funktionen wie Kamera, Neigungssensoren oder ähnliches mit JavaScript anzusteuern. So kann der Eindruck entstehen, es handle sich um eine ganz normale iOS App. Es ist von Anwendungsfall zu Anwendungsfall unterschiedlich wie gut eine Umsetzung als hybride App funktionieren kann. Grundsätzlich kann man sagen, je mehr auf die Hardware des Gerätes zugegriffen wird, desto eher sollte die App nativ umgesetzt werden. Der Vorteil hybrider Apps ist, dass ein Teil des Codes auf verschiedenen Plattformen wie iOS und Android verwendet werden kann. So kann Entwicklungsarbeit und Budget gespart werden.
Die App für Claretportal wurde als hybride App mit dem Framework Ionic umgesetzt. Ionic basiert auf Phonegap und AngularJS. Es ist ein sehr junges Open-Source Project, das bei Github aber schon sehr viele Mitentwickler gefunden hat.

See the Pen Side Menu and Navigation: 1.0.0-beta.6 by Florian Mutter (@elm) on CodePen.
Das eingebundene Beispiel zeigt, wie man mit dem Ionic-Framework ein Seitenmenü umsetzen kann. Weitere Beispiele gibt es bei Codepen. Ionic bringt bereits viele Teile mit, die zum Bauen einer App benötigt werden, wie z.B. eigene Cordova-Plugins um die native Tastatur richtig einzubinden, Unterstützung für Listen mit mehreren Tausend Einträgen, verschiedene Knöpfe, Checkboxen und Toggles oder Tabs.
Die Demo-App, die wir erstellt haben, setzt zum großen Teil ein eigenes Design ein. Die folgenden drei Screenshots zeigen die App.
Haupmenü
Neuigkeiten
Dokumentensuche
Durch den Einsatz von Ionic mit AngularJS konnte die App mit nur etwas mehr als 500 Zeilen Javascript-Code erstellt werden. Dabei sind alle Menüs und Kontrollelemente, die auf den Screenshots zu sehen sind, vollständig funktionsfähig. Die Suche wird von Claret auf dem Server ausgeführt und das Ergebnis angezeigt, sobald etwas in das Suchfeld getippt wird. Auch die Zahl der Dokumente die zu einem bestimmten Tag (links im Bild) verfügbar sind, aktualisiert sich sofort.

Da die App auf Cordova basiert, kann sie ohne Probleme auf iOS und Android eingesetzt werden. Die Unterstützung für Windows Phone soll in Ionic im Laufe des Sommers veröffentlicht werden.

Kommentare:

  1. Vielen Dank für das App Beispiel. Auch wir haben uns in letzter Zeit viel damit beschäftigt und sogar erste Apps auf Basis von Ionic erstellt und auf den Markt gebracht. Beispiel: Eine Fundbüro-App. Mehr dazu unter: http://www.flyacts.com/lost-and-find-fundbuero-innovativ-suchen-und-wiederfinden.

    Dabei ist uns allerdings aufgefallen, dass es für das doch recht junge Framework kaum Allgemeine Einführungen auf Deutsch gibt und haben daher einen Blogartikel über Ionic verfasst. Wäre vielleicht ja auch für euch interessant.
    Hier der Link zum einlesen.
    http://www.flyacts.com/blog/ionic-das-frontend-framework/

    Liebe Grüße
    Johanna

    AntwortenLöschen