Zusammenfassung von Kapitel 2. Aufbau einer App

  • Artikel

Beispiel herunterladen Das Beispiel herunterladen

Hinweis

Dieses Buch wurde im Frühjahr 2016 veröffentlicht und seitdem nicht aktualisiert. Wenngleich ein großer Teil des Buchs weiterhin relevante Informationen liefert, sind einige Abschnitte veraltet, und einige Themen sind nicht mehr korrekt oder vollständig.

In einer Xamarin.Forms-Anwendung werden Objekte, die Platz auf dem Bildschirm belegen, als visuelle Elemente bezeichnet, die in der VisualElement-Klasse gekapselt sind. Visuelle Elemente lassen sich in drei Kategorien unterteilen, die diesen Klassen entsprechen:

Eine Page-Ableitung nimmt den ganzen Bildschirm oder fast den ganzen Bildschirm ein. Häufig ist das untergeordnete Element einer Seite eine Layout-Ableitung, um untergeordnete visuelle Elemente zu organisieren. Die untergeordneten Elemente des Layout können andere Layout-Klassen oder View-Ableitungen sein (häufig als Elemente bezeichnet), wobei es sich um vertraute Objekte handelt wie Text, Bitmaps, Schieberegler, Schaltflächen, Listenfelder usw.

In diesem Kapitel wird veranschaulicht, wie Sie eine Anwendung erstellen, indem Sie sich auf das Label konzentrieren, wobei es sich um die View-Ableitung handelt, mit der Text angezeigt wird.

„Hallo“ sagen

Wenn Sie die Xamarin-Plattform installiert haben, können Sie in Visual Studio oder in Visual Studio für Mac eine neue Xamarin.Forms-Projektmappe erstellen. Die Hello-Projektmappe verwendet eine portable Klassenbibliothek (Portable Class Library) für den allgemeinen Code.

Hinweis

Portable Klassenbibliotheken wurden durch .NET Standard-Bibliotheken ersetzt. Der gesamte Beispielcode innerhalb des Buchs wurde aktualisiert und verwendet jetzt die .NET Standard-Bibliotheken.

Dieses Beispiel veranschaulicht eine Xamarin.Forms-Projektmappe, die ohne Änderungen in Visual Studio erstellt wurde. Die Projektmappe besteht aus vier Projekten:

  • Hello, eine portable Klassenbibliothek (Portable Class Library, PCL), die von anderen Projekten gemeinsam genutzt wird.
  • Hello.Droid, ein Anwendungsprojekt für Android.
  • Hello.iOS, ein Anwendungsprojekt für iOS.
  • Hello.UWP, ein Anwendungsprojekt für die universelle Windows-Plattform (Windows 10 und Windows 10 Mobile).

Hinweis

Xamarin.Forms bietet keine Unterstützung mehr für Windows 8.1, Windows Phone 8.1 oder Windows 10 Mobile, aber Xamarin.Forms-Anwendungen können unter Windows 10 Desktop ausgeführt werden.

Sie können jedes dieser Anwendungsprojekte als Startprojekt festlegen und dann das Programm auf einem Gerät oder Simulator erstellen und ausführen.

In vielen Ihrer Xamarin.Forms-Programme werden Sie die Anwendungsprojekte nicht ändern. Diese bleiben häufig kleine Stubs, mit denen nur das Programm gestartet wird. Der größte Teil Ihres Schwerpunkts liegt auf der Bibliothek, die allen Anwendungen zugrunde liegt.

Das Innere der Dateien

Die visuellen Elemente, die vom Hello-Programm angezeigt werden, werden im Konstruktor der App-Klasse definiert. App wird von der Xamarin.Forms-Klasse Application abgeleitet.

Hinweis

Mit den Visual Studio-Projektmappenvorlagen für Xamarin.Forms wird eine Seite mit einer XAML-Datei erstellt. XAML wird in diesem Buch erst in Kapitel 7 behandelt.

Der Abschnitt Verweise des Hello-PCL-Projekts enthält die folgenden Xamarin.Forms-Assemblys:

  • Xamarin.Forms.Core
  • Xamarin.Forms.Xaml
  • Xamarin.Forms.Platform

Die Verweise-Abschnitte der fünf Anwendungsprojekte enthalten zusätzliche Assemblys, die für die einzelnen Plattformen gelten:

  • Xamarin.Forms.Platform.Android
  • Xamarin.Forms.Platform.iOS
  • Xamarin.Forms.Platform.UWP
  • Xamarin.Forms.Platform.WinRT
  • Xamarin.Forms.Platform.WinRT.Tablet
  • Xamarin.Forms.Platform.WinRT.Phone

Hinweis

In den Verweise-Abschnitten dieser Projekte werden die Assemblys nicht mehr aufgeführt. Stattdessen enthält die Projektdatei PackageReference-Tags, die auf das Xamarin.Forms-NuGet-Paket verweisen. Im Abschnitt Verweise in Visual Studio wird das Xamarin.Forms -Paket anstelle der Xamarin.Forms-Assemblys aufgeführt.

Jedes der Anwendungsprojekte enthält einen Aufruf der statischen Forms.Init-Methode im Xamarin.Forms-Namespace. Dadurch wird die Xamarin.Forms-Bibliothek initialisiert. Für jede Plattform wird eine andere Version von Forms.Init definiert. Die Aufrufe dieser Methode finden Sie in den folgenden Klassen:

Zusätzlich muss jede Plattform den Speicherort der App-Klasse in der freigegebenen Bibliothek instanziieren. Dies erfolgt in einem Aufruf von LoadApplication in den folgenden Klassen:

Andernfalls handelt es sich bei diesen Anwendungsprojekten um normale „Do Nothing“-Programme (Nichts ausführen).

PCL oder SAP?

Es ist möglich, eine Xamarin.Forms-Projektmappe mit dem allgemeinen Code entweder in einer portierbaren Klassenbibliothek (Portable Class Library, PCL) oder in einem Projekt mit freigegebenen Anlagen (Shared Asset Project, SAP) zu erstellen. Wählen Sie zum Erstellen einer SAP-Projektmappe in Visual Studio die Option „Freigegeben“ aus. Die HelloSap-Lösung veranschaulicht die SAP-Vorlage ohne Änderungen.

Hinweis

Portable Klassenbibliotheken wurden durch .NET Standard-Bibliotheken ersetzt. Der gesamte Beispielcode innerhalb des Buchs wurde aktualisiert und verwendet jetzt die .NET Standard-Bibliotheken. Andernfalls sind sich die PCL- und .NET Standard-Bibliotheken konzeptionell sehr ähnlich.

Der Bibliotheksansatz bündelt den gesamten allgemeinen Code in einem Bibliotheksprojekt, auf das von den Plattformanwendungsprojekten verwiesen wird. Beim SAP-Ansatz ist der allgemeine Codein in allen Plattformanwendungsprojekten tatsächlich vorhanden und wird von diesen gemeinsam genutzt.

Die meisten Xamarin.Forms-Entwickler bevorzugen den Bibliotheksansatz. In diesem Buch verwenden die meisten Projektmappen eine Bibliothek. Die, die SAP verwenden, enthalten ein SAP-Suffix im Projektnamen.

Beim SAP-Ansatz kann der Code im freigegebenen Projekt mithilfe von C#-Präprozessordirektiven (#if, #elif und #endif) mit diesen vordefinierten Bezeichnern unterschiedlichen Code für die verschiedenen Plattformen ausführen:

  • iOS: __IOS__
  • Android: __ANDROID__
  • UWP: WINDOWS_UWP

In einer freigegebenen Bibliothek können Sie bestimmen, auf welcher Plattform Sie zur Laufzeit ausführen werden, wie Sie später in diesem Kapitel sehen werden.

Bezeichnungen für Text

Die Greetings-Projektmappe veranschaulicht, wie Sie dem anderen Greetings-Projekt eine neue C#-Datei hinzufügen. In dieser Datei wird eine Klasse namens GreetingsPage definiert, die sich von ContentPage ableitet. In diesem Buch enthalten die meisten Projekte eine einzelne ContentPage-Ableitung, deren Name dem Namen des Projekts entspricht, mit angehängtem Page-Suffix.

Der GreetingsPage-Konstruktor instanziiert eine Label-Ansicht, bei der es sich um die Xamarin.Forms-Ansicht handelt, in der Text angezeigt wird. Der Text-Eigenschaft wird auf den Text festgelegt, der von Label angezeigt werden soll. Dieses Programm legt das Label auf die Content-Eigenschaft von ContentPage fest. Der Konstruktor der App-Klasse instanziiert dann GreetingsPage und legt sie auf ihre MainPage-Eigenschaft fest.

Der Text wird in der oberen linken Ecke der Seite angezeigt. Unter iOS bedeutet dies, dass er die Statusleiste der Seite überlappt. Für dieses Problem gibt es mehrere Lösungen:

Lösung 1. Aufnehmen von Innenabstand auf der Seite

Legen Sie eine Padding-Eigenschaft auf der Seite fest. Padding ist vom Typ Thickness, einer Struktur mit vier Eigenschaften:

Padding definiert einen Bereich innerhalb einer Seite, in dem Inhalt ausgeschlossen wird. Hierdurch kann Label vermeiden, die iOS-Statusleiste zu überschreiben.

Lösung 2. Aufnehmen von Innenabstand nur für iOS (nur SAP)

Legen Sie eine „Padding“-Eigenschaft (Innenabstand) nur unter iOS fest, indem Sie ein SAP mit einer C#-Präprozessordirektive verwenden. Dies wird in der GreetingsSap-Projektmappe veranschaulicht.

Lösung 3. Aufnehmen von Innenabstand nur für iOS (PCL oder SAP)

In der Version von Xamarin.Forms, die für dieses Buch verwendet wird, kann eine Padding-Eigenschaft, die in einer PCL oder einem SAP für iOS spezifisch ist, mithilfe der statischen Device.OnPlatform- oder Device.OnPlatform<T>-Methode ausgewählt werden. Diese Methoden sind jetzt veraltet.

Die Device.OnPlatform-Methoden werden verwendet, um plattformspezifischen Code auszuführen oder plattformspezifische Werte auszuwählen. Intern verwenden sie statische, schreibgeschützte Device.OS-Eigenschaft, die einen Member der TargetPlatform-Enumeration zurückgibt:

Die Device.OnPlatform-Methoden, die Device.OS-Eigenschaft und die TargetPlatform-Enumeration sind jetzt alle veraltet. Verwenden Sie stattdessen die Device.RuntimePlatform-Eigenschaft, und vergleichen Sie den string-Rückgabewert mit den folgenden statischen Feldern:

  • iOS, die Zeichenfolge „iOS“.
  • Android, die Zeichenfolge „Android“.
  • UWP, die Zeichenfolge „UWP“, die sich auf die universelle Windows-Plattform bezieht.

Die statische, schreibgeschützte Device.Idiom-Eigenschaft ist damit verwandt. Diese gibt einen Member von TargetIdiom zurück, der diese Member enthält:

Für iOS und Android stellt der Trennungswert (Cutoff) zwischen Tablet und Phone eine Hochformatbreite von 600 Einheiten dar. Für die Windows-Plattform gibt Desktop eine UWP-Anwendung an, die unter Windows 10 ausgeführt wird, und Phone gibt eine UWP-Anwendung an, die unter einer Windows 10-Anwendung ausgeführt wird.

Lösungs 3a. Festlegen eines Rands für die Bezeichnung

Die Margin-Eigenschaft wurde zu spät eingeführt, um in diesem Buch enthalten zu sein, aber Sie ist ebenfalls vom Typ Thickness, und Sie können sie für das Label festlegen, um einen Bereich außerhalb der Ansicht zu definieren, der in der Berechnung des Layouts der Ansicht einbezogen wird.

Die Padding-Eigenschaft ist nur für Ableitungen von Layout und Page verfügbar. Die Margin-Eigenschaft ist für alle View-Ableitungen verfügbar.

Lösung 4. Zentrieren der Bezeichnung innerhalb der Seite

Sie können das Label innerhalb der Page zentrieren (oder es an einer von acht anderen Stellen platzieren), indem Sie die Eigenschaften HorizontalOptions und VerticalOptions von Label auf einen Wert vom Typ LayoutOptions festlegen. Die LayoutOptions-Struktur definiert zwei Eigenschaften:

  • Eine Alignment Eigenschaft vom Typ LayoutAlignment, eine Enumeration mit vier Membern: Start, was abhängig von der Ausrichtung links oder oben bedeutet, Center, Endwas je nach Ausrichtung rechts oder unten bedeutet, und Fill.

  • Eine Expands-Eigenschaft vom Typ bool.

Im Allgemeinen werden diese Eigenschaften nicht direkt verwendet. Stattdessen werden Kombinationen dieser beiden Eigenschaften durch acht statische, schreibgeschützte Eigenschaften vom Typ LayoutOptions bereitgestellt:

HorizontalOptions und VerticalOptions sind die wichtigsten Eigenschaften im Xamarin.Forms-Layout und werden ausführlicher in Kapitel 4: „Scrollen im Stapel“, behandelt.

Im Folgenden sehen Sie das Ergebnis, wenn die Eigenschaften HorizontalOptions und VerticalOptions von Label beide auf LayoutOptions.Centerfestgelegt sind:

Dreifacher Screenshot des Begrüßungsprogramms

Lösung 5. Zentrieren des Texts innerhalb der Bezeichnung

Sie können den Text auch zentrieren (oder an acht anderen Stellen auf der Seite platzieren), indem Sie die Eigenschaften HorizontalTextAlignment und VerticalTextAlignment von Label auf einen Member der TextAlignment-Enumeration festlegen:

  • Start, was links oder oben bedeutet (abhängig von der Ausrichtung).
  • Center
  • End, was rechts oder unten bedeutet (abhängig von der Ausrichtung).

Diese beiden Eigenschaften werden nur von Label definiert, während die Eigenschaften HorizontalAlignment und VerticalAlignment von View definiert und von allen View-Ableitungen geerbt werden. Die visuellen Ergebnisse sehen möglicherweise ähnlich aus, sind aber sehr unterschiedlich, wie im nächsten Kapitel veranschaulicht wird.