GUI nach Maß dank Xamarin.Forms – Teil 2

Fragmentierung und Testing in Xamarin Studio für Android
Kommentare

Aus Xamarin, der .NET Runtime für Unix, wurde ein veritables Cross-Plattform-System, das mit Xamarin.Forms sogar einen eigenen plattformunabhängigen GUI-Stack anbietet. Im zweiten Teil dieser Artikelserie beschäftigen wir uns mit der Fragmentierung, Lokalisierung und dem Testing in Xamarin Studio.

Diese Artikelserie wird Schritt für Schritt erklären, wie man GUIs für Android mit Xamarin Studio erstellt. Im ersten Teil widmeten wir uns zunächst der Aktualisierung von Visual Studio, dem Start der Erstellung von GUIs mit Xamarin Studio und der Fehlersuche. Im zweiten Teil geht es jetzt um Fragmentierung, Lokalisierung und Testing in Xamarin Studio. Später beschäftigen wir uns mit der gesamten Hostplattform und wollen in Teil 3 die Android-Besonderheiten bei der Entwicklung mit Xamarin näher kennenlernen, bevor wir uns in Teil 4 mit den Sicherheitsvorkehrungen und Gefahren befassen.

Fragmentierung

Fragmentierung ist ein hässliches Wort. Schon zu Zeiten von Palm OS und Windows Phone gab es verschiedene Smartphonearten, da jeder Nutzer seine eigene Handgröße und seine eigenen Bedürfnisse mitbrachte. Der eine brauchte einen möglichst großen Bildschirm, während der andere zur Bearbeitung von E-Mails eine Tastatur und aufgrund des kleineren Bildschirms einen geringeren Akkuverbrauch bevorzugt hat.

Der immense Erfolg des iPhone brachte Handcomputern Medienaufmerksamkeit. Schlecht informierte Journalisten brachten Fragmentierung auf; das Buzzword geistert seitdem wie ein losgelassener Heißluftballon durch die Welt.

Android ist von Haus aus gut auf das Handhaben von Fragmentierungssituationen vorbereitet. Entwickler weisen das Betriebssystem dazu an, eine Ressource aus einer XML-Datei wiederzubeleben. Das Betriebssystem sucht die XML-Datei dabei anhand des übergebenen Namens aus. Was genau passiert, ist ein vergleichsweise komplexer und hochinteressanter Prozess.

Die Dateinamen bzw. Ordnerpfade von Ressourcen sind keine reinen Strings. Als Beispiel dafür betrachten wir die folgende Struktur, die aus einer praktischen Applikation entnommen wurde:

 
res/
  layout/   
      main.xml
  layout-ar/  
      main.xml
  layout-ldrtl/  
      main.xml

main.xml liegt hier in drei Versionen vor. Die im Ordner layout liegende Datei repräsentiert den „Standard“. ar ist der stärkste Qualifikator: Ein arabisches Telefon würde immer die im Unterordner layout-ar liegende Variante laden. ldrtl dient als „Catch-All-Qualifikator“. Ist das Smartphone nicht auf Arabisch eingestellt, weist aber eine LTR-Sprache auf, so wird diese Datei geladen.

Will man eine App beispielsweise mit zwei verschiedenen Layouts für den Portrait- und den Landscape-Mode ausstatten, so ist das kein besonderes Problem. Man legt einfach zwei verschiedene Versionen der XML-Datei an und überlässt dem Betriebssystem die Qual der Wahl.

Wir wollen diese Aufgabe nun unter Nutzung von Xamarin Designer für Android realisieren. Das unter Android Studio zur Verfügung stehende Ordnerkonstruktionswerkzeug ist in Visual Studio nicht implementiert. Öffnen Sie die Datei Main.axml stattdessen im Editor, und klicken Sie das Telefonsymbol neben dem Label „Device“ einige Male an.

Xamarin Designer reagiert darauf mit dem Einblenden der Versionsliste, die im Moment nur „Default“ anbietet. Klicken Sie auf New Version, um die Microsoft-Version des Generators zu erzeugen – Abbildung 5 zeigt die richtige Konfiguration.

Abb. 5: Setzen des Landscape-Qualifiers erzeugt für Landscape-Mode geeignetes Formular

Abb. 5: Setzen des Landscape-Qualifiers erzeugt für Landscape-Mode geeignetes Formular

Mit nativen Android-IDEs erfahrene Entwickler müssen an dieser Stelle umdenken. Im Solution Explorer erscheint anfangs nur eine .axml-Datei – die „Unterversionen“ scheinen, wenn überhaupt, erst nach einem Kompilationsvorgang auf.

Zur Demonstration des Verhaltens ergänzen wir das Formular um ein zweites LinearLayout, das die beiden Buttons nebeneinander anordnet. Die Umordnung geht im Outlinefenster am bequemsten von der Hand – speichern Sie das File, wenn Sie mit den Resultaten zufrieden sind. Der Bildschirm des Emulators lässt sich durch Betätigen von CTRL + F11 in den Landscape-Mode versetzen – falls Sie sich davon überzeugen wollen, dass das Programm korrekt funktioniert.

Bei der Arbeit mit verschachtelten Layouts hilft Xamarin Designer mit Komfortfeatures aus. Das mit Abstand wichtigste ist der Layouthervorheber, dessen Aktivierung die Abstände zwischen den Steuerelementgruppen erhöht. Zudem öffnet ein Rechtsklick auf ein Steuerelement eine Liste von Einträgen, die das Auswählen der Elternlayouts erlauben.

Zu guter Letzt gibt es mit der Option „Multi-edit“ die Möglichkeit, mehrere Varianten des Layouts gleichzeitig zu bearbeiten. Dies spart insbesondere dann Zeit, wenn größere Änderungen am Gesamtaufbau erforderlich sind.

Xamarin im Videotutorial

entwickler.tutorialsIn unserem entwickler.tutorial Einstieg in Cross-Plattform-App-Development mit Xamarin zeigt Jörg Neumann, wie Xamarin funktioniert und wie Sie das Maximum aus der Plattform herausholen können. Wer sich jetzt anmeldet, sichert sich das 3-in-1 Gratistutorial – und kann das erste Kapitel des Tutorials kostenlos sehen!

Effizientere Lokalisierung

Als der Autor dieser Zeilen noch ein junger Spund war, veröffentlichte der damals in IT-Kreisen bekannte Eric Sink einen Blogbeitrag zur Lokalisierung. Der Tenor: Es lohnt sich nicht; meine japanische Lokalisierung bringt etwa so viel ein wie ich im Monat für Sushi ausgebe.

Dank dem Aufkommen von App Stores und der damit einhergehenden Flut von Apps ist Lokalisierung heute wesentlich wichtiger. Wenn man schon für das Wort „Aeroplane“ keinen Topplatz in der Liste erreichen kann, geht es ja vielleicht mit „авиационный“ (Russisch), uçak (Türkisch) oder aviadilo (Esperanto).

Rein theoretisch könnte man die Internationalisierung von Android-Apps über das Anbieten von Layoutfiles erledigen. Das wäre allerdings insofern ineffizient, als dass ein Großteil des XML-Codes „nutzlos“ verfiele. Eine bessere Möglichkeit ist die Einführung einer Abstraktionsebene. Die Layoutdateien enthalten dabei statt der darzustellenden Strings reduzierte String-IDs, die vom System während der Programmausführung durch in der jeweiligen Systemsprache gehaltene Texte ersetzt werden. Diese finden sich in so genannten String-Dateien, die per Konvention normalerweise strings.xml heißen.

An dieser Stelle rächt sich das Nichtvorhandensein des weiter oben erwähnten Verzeichniskonstrukteurs: Es gibt keine grafische Unterstützung für die Erzeugung von Varianten der Datei strings.xml. Erstellen Sie deshalb einen weiteren Ordner namens values-de, in den sie die Datei strings.xml unter Beibehaltung der Build-Action „Android Resource“ kopieren. Passen Sie ihren Inhalt folgendermaßen an:

 
<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="Hello">Bitte hier klicken!</string>
  <string name="ApplicationName">GUITest</string>
</resources>
Strukturvorlage
Ist man sich bei einer Verzeichnis- oder Qualifikatorstruktur nicht sicher, so bietet sich der Rückgriff auf Android Studio an. Der von Google bereitgestellte Ordnergenerator kann als „Vorlage“ für die zu erzeugende Struktur herangezogen werden.

Zum Test der Applikation können Sie den Emulator wie ein normales Smartphone ins Deutsche umwandeln – der Text erscheint ab dem nächsten Start auf Deutsch.

Testing

Das größte Problem bei der Arbeit mit Ressourcenvarianten ist das Testen aller möglichen Permutationen. Die weiter oben zum Setzen eines vernünftigen Zoomfaktors zweckentfremdeten Landscape- und Portrait-Mode-Buttons bieten ein Menü an, mit dem sich die vom Designer gerenderte Variante anpassen lässt.

Auf der linken oberen Kante des Bildschirms finden sich weitere Optionen. Das Devicedialogfeld erlaubt die Auswahl des Telefons, das für das Rendering der Vorschau verwendet werden soll. Wie unter Android Studio funktioniert das Übernehmen der Bildschirmgröße im Allgemeinen gut, während das Einstellen der plattformspezifischen Rendering-Engine nicht immer funktioniert.

Material Design

Das Material Design ließ in Sachen GUI-Design keinen Stein auf dem anderen: Google nutzte das Update für radikale Veränderungen. Eine wichtige Regel ist die Empfehlung, Steuerelemente in einem fixen Gitter anzuordnen – der Xamarin Designer unterstützt diese Arbeit durch das in Abbildung 6 gezeigte Positionierungsgitter.

Abb. 6: Steuerelemente richten sich wie von Geisterhand automatisch aus

Abb. 6: Steuerelemente richten sich wie von Geisterhand automatisch aus

Ein weiteres Feature findet sich hinter dem Pfeil: Xamarin unterstützt auch die Erzeugung der für die Festlegung der Steuerelementfarben zuständigen Themes mit einem dedizierten Werkzeug. Weitere Informationen dazu finden sich in der hier zugänglichen Dokumentation, zu deren Verständnis aber Hintergrundwissen über das Gesamtkonzept des Material Designs notwendig ist.

Fazit

Der in Xamarin Studio eingebaute Android Designer erleichtert Entwicklern die Arbeit mit Layoutfiles – was den Komfort anbetrifft ist er durchaus mit dem in Android Studio integrierten Werkzeug vergleichbar. Das bedeutet allerdings nicht, dass man als .NET-Entwickler nun freudig drauflos programmieren kann. Kenntnisse des Android-GUI-Systems sind nach wie vor erforderlich; der Code lässt sich zudem nicht unter iOS oder Windows Phone weiterverwenden.

Wer wahre Cross-Plattform-Applikationen erzeugen möchte, muss stattdessen auf das in der Einleitung erwähnte Xamarin.Forms setzen. Wir stellen Ihnen diesen Stack in einer der nächsten Ausgaben im Detail vor. Bis dahin wünscht der Autor „gut Code“!

Im nächsten Teil der Artikelserie beschäftigen wir uns mit der gesamten Hostplattform Xamarin.

Windows Developer

Windows DeveloperDieser Artikel ist im Windows Developer erschienen. Windows Developer informiert umfassend und herstellerneutral über neue Trends und Möglichkeiten der Software- und Systementwicklung rund um Microsoft-Technologien.

Natürlich können Sie den Windows Developer über den entwickler.kiosk auch digital im Browser oder auf Ihren Android- und iOS-Devices lesen. In unserem Shop ist der Windows Developer ferner im Abonnement oder als Einzelheft erhältlich.

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -