Entwickeln von Windows 10 Mobile Apps mit Apache Cordova

Erstellt: 04.01.2016 von Roberto De Simone
Aktualisiert: 15.05.2017

[Dieser Blog wurde für cordova-windows@5.0.0 aktualisiert]

Die Cordova Windows Plattform

Cordova Windows ist nach dem Erscheinen von Windows Phone 8.1 verfügbar geworden und wird weitgehend von Microsoft unterhalten. Die Cordova Windows Plattform wurde mit JavaScript entwickelt und greift damit auf die Windows Laufzeitumgebung zu. Seit der Version 4 von Cordova Windows wird auch die Erstellung von Windows 10 Universal Apps (UWP) unterstützt. Dies erlaubt die Entwicklung von Apps, welche auf verschiedensten Geräten lauffähig sind, die Windows 10 verwenden. Dabei wird auf ein responsives Verhalten der App gesetzt.

Windows 10 Mobile verwendet als WebView Edge. Dies ändert nun alles!

Windows 10 Unterstützung einem Cordova Windows Projekt hinzufügen

Einem Projekt Windows 10 Unterstützung hinzuzufügen geschieht einfach durch das Hinzufügen von drei Parametern in config.xml. Weitere Einstellungen und Parameter können der Dokumentation zu Cordova Windows 10 entnommen werden. Weitere Informationen finden sich in der MSDN Dokumentation.

<preference name="windows-phone-target-version" value="10.0" />
<preference name="Windows.Mobile" value="10.0.10240.0" />
<preference name="Windows.Mobile-MaxVersionTested" value="10.0.14393.1066" />

Vorteile des neuen WebViews von Windows 10 Mobile

Die Ausführung von JavaScript-Code hat sich gegenüber dem alten auf Trident basierenden WebView von Windows Phone 8.1 drastisch verbessert. Code, welcher für Android und iOS funktioniert, kann jetzt auch für Windows Phone 10 verwendet werden. Die Problematik des Viewports ist verschwunden. Es ist nicht mehr notwendig, in den HTML Tag eine Schriftgrösse einzufügen und für Grössenangaben em zu verwenden. Der WebView ist nach wie vor nicht fest in der Seite fixiert. Dies kann aber mit CSS-Regeln gelöst werden. Das inner bouncing ist nun verfügbar.

Der Splash Screen funktioniert nun korrekt

Seit cordova-windows@5.0.0 funktioniert der Splash Screen korrekt. Das sehr störende Auf- und Abbewegen wegen der Soft Navigation Bar ist nun behoben.

Es muss aber erwähnt werden, dass ein Splash Screen im Gegensatz zu Android und iOS nach wie vor nur in Form eines Icons, welches auf einem Hintergrund platziert wird, erstellt werden kann.

Fehlende Plugins

Für zahlreiche populäre Plugins gibt es keine Windows Unterstützung. Die meisten Plugins, welche von der Community programmiert werden, können lediglich für Android und iOS verwendet werden.

An dieser Stelle muss auch etwas Kritik an Microsoft geübt werden. Wenn Microsoft möchte, dass für die Windows Plattform Apps erstellt werden, muss die Welt der Plugins ernster genommen und Windows Unterstützung in die populärsten Plugins implementiert werden. Aktuell gibt es nur eine kleine Zahl von Entwicklern aus der Community, welche für die Cordova Windows Plattform Code beisteuert. Es liegt an Microsoft, die Lücke zu Android und iOS zu schliessen.

Die Entwicklung von Plugins für Cordova Windows ist einfach

Cordova Windows Plugins werden mit JavaScript (C# ist ebenfalls möglich) erstellt, und es werden im Gegensatz zu Android und iOS keine Kenntnisse einer nativen Programmiersprache benötigt. Für Android und iOS braucht es Java bzw. Objective-C Kenntnisse. Ein weiterer Vorteil der Windows Plattform besteht darin, dass nicht zwingend ein Plugin benötigt wird, wenn native APIs verwendet werden sollen. APIs können direkt aus dem JavaScript Code heraus aufgerufen werden.

Wie soll eine Windows 10 Mobile App aussehen

Nebst den eingeschränkten Möglichkeiten des alten Windows Phone 8.1 WebViews war es auch schwierig Cordova Apps zu entwickeln, welche das Aussehen und das Verhalten einer Windows Phone 8.1 App besitzen. Die Navigationsleiste einer Windows Phone 8.1 App sieht im Vergleich zu Android und iOS anders aus und funktioniert dementsprechend auch anders.

Die Telefon App in Windows Phone 8.1

Die Telefon App in Windows Phone 8.1 mit der alten Navigationsleiste. Diese besitzt grosse Titel für die einzelnen Module (Sektionen) und die Navigation geschieht durch seitliches Wischen. Unten an der Seite befindet sich die Werkzeugleiste.

Mit Windows 10 Mobile ändert sich die Benutzerschnittstelle - die finale Ausgestaltung ist noch nicht völlig klar. Nicht alle Apps sehen gleich aus und verwenden dieselben Konzepte. Allerdings ist die alte Navigationsleiste weitgehend verschwunden. Eine Windows 10 Mobile App entspricht nun eher einer Android oder iOS App. Dies sind gute Nachrichten für die Entwicklung von Crossplattform Apps, weil eine bestehende Android/iOS App nun eher an Windows Mobile angepasst werden kann und auch UI Frameworks einfacher Windows Mobile unterstützen können.

the dialer app in Windows 10 Mobile

Die Telefon App in Windows 10 Mobile besitzt neu eine Navigationsleiste, welche jener von Android oder iOS entspricht. In der Tat sieht diese nun wie ein Tabbar in Android aus. Unten an der Seite befindet sich nach wie vor eine Werkzeugleiste.

Um bessere Hinweise zur Gestaltung einer Windows Phone App zu erhalten, dürfte es interessant sein, die Aktualisierung von Microsoft Outlook für Windows 10 Mobile zu sehen. Wenn man sich intensiv mit den Designrichtlinien für Windows 10 Universal Apps auseinandersetzen möchte, kann das ausführliche Handbuch dazu konsultiert werden.

UI JavaScript Frameworks zur Unterstützung von Windows Phone

Nach meinem Wissensstand gibt es zur Zeit kein auf JavaScript basierendes UI Framework, welches die Entwicklung von Windows UWP Apps unterstützt. Sogar für Microsofts WinJS scheinen keine Aktivitäten mehr erkennbar zu sein.

Ionic unterstützt Windows, aber die UI Komponenten passen sich zur Zeit nur beschränkt der Windows Plattform an.

Daraus folgt, dass Apps für Windows Phone vorerst wie Android oder iOS Anwendungen auf Windows Phone aussehen werden. Apps, welche nicht den Plattformrichtlinien folgen - diese passen die Benutzerschnittstelle dem Corporate Identity an - werden auch auf Windows Phone 10 ihre eigene Charakteristik behalten - die App sieht auf allen Plattformen gleich aus.

Auch hier ist wieder Microsoft gefragt. Meiner Meinung nach sollte Microsoft den populärsten UI Frameworks Unterstützung anbieten, damit diese dafür sorgen, dass eine App auf der Windows Phone Plattform sich auch optisch an diese anpasst.

Schlussfolgerung

Unabhängig von der Zukunft von Windows 10 Mobile ist es nun möglich, schöne Apps mit Cordova Windows zu entwickeln. Microsoft sollte dafür sorgen, dass die populären UI Frameworks für Windows Phone erweitert werden.

Als Resultat werden Cordova Apps beinahe kostenlos eine Windows 10 Mobile Version erhalten. Dies dürfte schlussendlich auch der Grund dafür sein, dass sich Microsoft für das Cordova Projekt engagiert. Mit einfachen Mitteln wird die Anzahl der Apps für die Windows Phone Plattform erhöht.