Partager via

Résumé du chapitre 2. Anatomie d’une application

  • Article

Remarque

Ce livre a été publié au printemps 2016 et n’a pas été mis à jour depuis. Il y a beaucoup dans le livre qui reste précieux, mais certains documents sont obsolètes, et certains sujets ne sont plus entièrement corrects ou complets.

Dans une Xamarin.Forms application, les objets qui occupent de l’espace sur l’écran sont appelés éléments visuels, encapsulés par la VisualElement classe. Les éléments visuels peuvent être divisés en trois catégories correspondant à ces classes :

Un Page dérivé occupe l’écran entier, ou presque l’écran entier. Souvent, l’enfant d’une page est un Layout dérivé pour organiser les éléments visuels enfants. Les enfants de l’objet Layout peuvent être d’autres Layout classes ou View dérivés (souvent appelés éléments), qui sont des objets familiers tels que du texte, des bitmaps, des curseurs, des boutons, des zones de liste, etc.

Ce chapitre montre comment créer une application en mettant l’accent sur le Labeldérivé qui affiche du View texte.

Say hello

Une fois la plateforme Xamarin installée, vous pouvez créer une Xamarin.Forms solution dans Visual Studio ou Visual Studio pour Mac. La solution Hello utilise une bibliothèque de classes portable pour le code commun.

Remarque

Les bibliothèques de classes portables ont été remplacées par des bibliothèques .NET Standard. Tous les exemples de code du livre ont été convertis pour utiliser des bibliothèques .NET standard.

Cet exemple illustre une Xamarin.Forms solution créée dans Visual Studio sans modification. La solution se compose de quatre projets :

  • Hello, bibliothèque de classes portable (PCL) partagée par les autres projets
  • Hello.Droid, un projet d’application pour Android
  • Hello.iOS, un projet d’application pour iOS
  • Hello.UWP, un projet d’application pour le plateforme Windows universelle (Windows 10 et Windows 10 Mobile)

Remarque

Xamarin.Formsne prend plus en charge Windows 8.1, Windows Téléphone 8.1 ou Windows 10 Mobile, mais Xamarin.Forms les applications s’exécutent sur le bureau Windows 10.

Vous pouvez effectuer l’un de ces projets d’application le projet de démarrage, puis générer et exécuter le programme sur un appareil ou un simulateur.

Dans la plupart de vos Xamarin.Forms programmes, vous ne modifierez pas les projets d’application. Ces petits stubs restent souvent minuscules pour démarrer le programme. La plupart de vos efforts seront la bibliothèque commune à toutes les applications.

À l’intérieur des fichiers

Les visuels affichés par le programme Hello sont définis dans le constructeur de la App classe. App dérive de la Xamarin.Forms classe Application.

Remarque

Modèles de solution Visual Studio pour Xamarin.Forms créer une page avec un fichier XAML. XAML n’est pas abordé dans ce livre jusqu’au chapitre 7.

La section Références du projet Hello PCL inclut les assemblys suivants Xamarin.Forms :

  • Xamarin.Forms. Core
  • Xamarin.Forms. Xaml
  • Xamarin.FormsPlate-forme.

Les sections Références des cinq projets d’application incluent des assemblys supplémentaires qui s’appliquent aux plateformes individuelles :

  • 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. Téléphone

Remarque

Les sections Références de ces projets ne répertorient plus les assemblys. Au lieu de cela, le fichier projet contient des balises PackageReference référençant le Xamarin.Forms package NuGet. La section Références de Visual Studio répertorie le Xamarin.Forms package plutôt que les Xamarin.Forms assemblys.

Chacun des projets d’application contient un appel à la méthode statique Forms.Init dans l’espace Xamarin.Forms de noms. Cela initialise la Xamarin.Forms bibliothèque. Une version différente est Forms.Init définie pour chaque plateforme. Les appels à cette méthode se trouvent dans les classes suivantes :

En outre, chaque plateforme doit instancier l’emplacement de classe App dans la bibliothèque partagée. Cela se produit dans un appel aux LoadApplication classes suivantes :

Dans le cas contraire, ces projets d’application sont des programmes « ne rien faire » normaux.

PCL ou SAP ?

Il est possible de créer une Xamarin.Forms solution avec le code commun dans une bibliothèque de classes portable (PCL) ou un projet sap (Shared Asset Project). Pour créer une solution SAP, sélectionnez l’option Partagé dans Visual Studio. La solution HelloSap illustre le modèle SAP sans modification.

Remarque

Les bibliothèques de classes portables ont été remplacées par des bibliothèques .NET Standard. Tous les exemples de code du livre ont été convertis pour utiliser des bibliothèques .NET standard. Sinon, les bibliothèques PCL et .NET Standard sont conceptuellement très similaires.

L’approche de bibliothèque regroupe tout le code commun dans un projet de bibliothèque référencé par les projets d’application de plateforme. Avec l’approche SAP, le code commun existe efficacement dans tous les projets d’application de plateforme et est partagé entre eux.

La plupart des Xamarin.Forms développeurs préfèrent l’approche de la bibliothèque. Dans ce livre, la plupart des solutions utilisent une bibliothèque. Ceux qui utilisent SAP incluent un suffixe Sap dans le nom du projet.

Avec l’approche SAP, le code du projet partagé peut exécuter un code différent pour les différentes plateformes à l’aide des directives de préprocesseur C# (#if, #elifet #endif) avec ces identificateurs prédéfinis :

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

Dans une bibliothèque partagée, vous pouvez déterminer la plateforme sur laquelle vous exécutez au moment de l’exécution, comme vous le verrez plus loin dans ce chapitre.

Étiquettes pour le texte

La solution Greetings montre comment ajouter un nouveau fichier C# au projet Greetings . Ce fichier définit une classe nommée GreetingsPage qui dérive de ContentPage. Dans ce livre, la plupart des projets contiennent un dérivé unique ContentPage dont le nom est le nom du projet avec le suffixe Page ajouté.

Le GreetingsPage constructeur instancie une Label vue, qui est la vue qui affiche du Xamarin.Forms texte. La Text propriété est définie sur le texte affiché par le Label. Ce programme définit la LabelContent propriété de ContentPage. Le constructeur de la App classe instancie GreetingsPage et le définit sur sa MainPage propriété.

Le texte s’affiche dans le coin supérieur gauche de la page. Sur iOS, cela signifie qu’il chevauche la barre d’état de la page. Il existe plusieurs solutions à ce problème :

Solution 1. Inclure le remplissage sur la page

Définissez une Padding propriété sur la page. Padding est de type Thickness, une structure avec quatre propriétés :

Padding définit une zone à l’intérieur d’une page où le contenu est exclu. Cela permet Label d’éviter de remplacer la barre d’état iOS.

Solution 2. Inclure le remplissage uniquement pour iOS (SAP uniquement)

Définissez une propriété « Padding » uniquement sur iOS à l’aide d’un SAP avec une directive de préprocesseur C#. Ceci est illustré dans la solution GreetingsSap.

Solution 3. Inclure le remplissage uniquement pour iOS (PCL ou SAP)

Dans la version utilisée Xamarin.Forms pour le livre, une Padding propriété spécifique à iOS dans une bibliothèque PCL ou SAP peut être sélectionnée à l’aide de la méthode statique ou Device.OnPlatform<T> statiqueDevice.OnPlatform. Ces méthodes sont désormais déconseillées

Les Device.OnPlatform méthodes sont utilisées pour exécuter du code spécifique à la plateforme ou pour sélectionner des valeurs spécifiques à la plateforme. En interne, ils utilisent la Device.OS propriété statique en lecture seule, qui retourne un membre de l’énumération TargetPlatform :

Les Device.OnPlatform méthodes, la Device.OS propriété et l’énumération TargetPlatform sont désormais déconseillées. Utilisez plutôt la Device.RuntimePlatform propriété et comparez la string valeur de retour avec les champs statiques suivants :

  • iOS, chaîne « iOS »
  • Android, chaîne « Android »
  • UWP, la chaîne « UWP », faisant référence à la plateforme Windows universelle

La Device.Idiom propriété statique en lecture seule est liée. Cela retourne un membre du TargetIdiom, qui a les membres suivants :

Pour iOS et Android, le découpage entre Tablet et Phone est une largeur portrait de 600 unités. Pour la plateforme Windows, Desktop indique une application UWP s’exécutant sous Windows 10 et Phone indique une application UWP s’exécutant sous l’application Windows 10.

Solution 3a. Définir la marge sur l’étiquette

La Margin propriété a été introduite trop tard pour être incluse dans le livre, mais elle est également de type Thickness et vous pouvez la définir sur la Label zone pour définir une zone en dehors de la vue incluse dans le calcul de la disposition de la vue.

La Padding propriété est disponible uniquement sur et Page sur Layout les dérivés. La Margin propriété est disponible sur tous les View dérivés.

Solution 4. Centrer l’étiquette dans la page

Vous pouvez centrer l’intérieur LabelPage (ou le placer à l’un des huit autres emplacements) en définissant les propriétés et VerticalOptions les HorizontalOptions propriétés du Label type sur une valeur de typeLayoutOptions. La LayoutOptions structure définit deux propriétés :

  • Propriété Alignment de type LayoutAlignment, énumération avec quatre membres : Start, ce qui signifie gauche ou supérieur selon l’orientation, Center, Endce qui signifie droite ou inférieure en fonction de l’orientation et Fill.

  • Propriété Expands de type bool.

En règle générale, ces propriétés ne sont pas utilisées directement. Au lieu de cela, les combinaisons de ces deux propriétés sont fournies par huit propriétés statiques en lecture seule de type LayoutOptions:

HorizontalOptions et VerticalOptions sont les propriétés les plus importantes dans Xamarin.Forms la disposition et sont abordées plus en détail dans le chapitre 4. Défilement de la pile.

Voici le résultat avec les HorizontalOptions propriétés des VerticalOptionsLabel deux valeurs définies sur LayoutOptions.Center:

Capture d’écran triple du programme de salutations

Solution 5. Centrer le texte dans l’étiquette

Vous pouvez également centrer le texte (ou le placer dans huit autres emplacements de la page) en définissant les propriétés et VerticalTextAlignment les HorizontalTextAlignment propriétés d’un membre de Label l’énumération TextAlignment :

  • Start, signification gauche ou supérieure (en fonction de l’orientation)
  • Center
  • End, signification droite ou inférieure (en fonction de l’orientation)

Ces deux propriétés sont définies uniquement par Label, tandis que les VerticalAlignmentHorizontalAlignment propriétés sont définies par View et héritées par tous les View dérivés. Les résultats visuels peuvent sembler similaires, mais ils sont très différents comme le montre le chapitre suivant.