En savoir plus sur la conception de matériaux dans les formulaires Xamarin

Vous vous demandez comment obtenir le même aspect pour votre application Xamarin Forms sur Android et iOS? Apprenez à implémenter Material Design dans vos applications Xamarin Forms et simplifiez-le.

Comme nous le savons, lorsque nous travaillons avec la conception dans Xamarin Forms, les contrôles sont rendus aux contrôles natifs définis par chaque plate-forme. C'est pourquoi nous déclarons parfois un conteneur aussi simple qu'une entrée, et lorsque nous le visualisons dans Android, il semble différent d'iOS. Et c'est vraiment incroyable ?! Mais que se passe-t-il si nous avons un client qui requiert que leur application soit identique sur Android et iOS?

Pour cela, il y a Material Design qui est un système de conception chargé de rendre nos contrôles même visualisation dans chaque plate-forme.

Pour pouvoir l'implémenter dans Xamarin, nous avons Xamarin.Forms Material Visual qui est utilisé pour appliquer les conceptions définies dans Material Design.

⚠ Important To Connaître

Sur Android:

? Material Visual nécessite une version minimale de 5.0 (API 21) ou supérieure

? TargetFramework de la version 9.0 (API 28)

Première de tous … De quoi ai-je besoin?

➖ Ajouter à partir du package NuGet le plugin: Xamarin.Forms.Visual.Material

➖ Initialisons l'initialisation Matériel visuel sur chaque plate-forme

Ajoutez les lignes suivantes après le Xamarin.Forms.Form s.Init méthode:

Sur Android: Dans votre MainActivity.cs :

  global :: Xamarin.Forms.FormsMaterial.Init (this, savedInstanceState);

Sur iOS: Dans votre AppDelegate.cs :

 global :: Xamarin.Forms.FormsMaterial.Init ();

Commençons!

Apprenons les commandes prises en charge par Visual Material

Il est important de connaître les commandes qui sont réellement prises en charge par Visual. Ces contrôles sont effectués par des rendus de matériaux, qui appliquent les règles de conception des matériaux.

Application de matériel Visual

Il est si facile à utiliser – il vous suffit d'ajouter la propriété Visual à vos commandes. [19659003] Sur votre XAML:

    
          ...
    

Vous pouvez également l'appliquer dans votre fichier C #:

  ContentPage cp = new ContentPage ();
    cp.Visual = VisualMarker.Material ou VisualMarker.MatchParent ouVisualMarker.Default

La propriété visuelle obtient les valeurs suivantes:

? Valeur par défaut: Rendu de la vue à l'aide du rendu par défaut.

? Matériau: Rendu de la vue avec le rendu direct aux parents.

? MatchParent: Rendez la vue à l'aide du rendu Material.

Et maintenant, voyons quelques exemples de mes commandes préférées que Visual nous apporte!

Merci d'avoir lu !!! ? ?

Références:
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/visual/