Vous consultez une page technique concernant le logiciel de gestion Mercator. Celle-ci contient des informations spécifiques destinées aux professionnels de Mercator. Souhaitez-vous être redirigés vers des informations plus générales ?


   Ne plus poser cette question

Notions de paramétrage d'écrans en XAML

0000002763     -      11/12/2019

XAML (prononcé Zammel) est un langage déclaratif, dialecte de XML, permettant notamment la définition d'interfaces utilisateurs. Il est à la base de la création d'écrans dans la plateforme de développement Xamarin Forms. XAML est utilisé dans Mercator pour paramétrer la partie "interface utilisateur" des bundles :

  • dans les bundles de type "liste" : 
    • pour la définition du formulaire de saisie affiché dans le haut de l'écran
    • dans la liste, pour la définition d'un template de cellule qui sera affiché pour chaque enregistrement de la ListView
  • dans les bundles de type "graphique" : uniquement pour la définition du formulaire de saisie affiché dans le haut de l'écran.

 

Exemple de formulaire défini en XAML pour la recherche d'un client, soit par son nom, soit par son code postal

<StackLayout Margin="10, 10, 10, 10">
<StackLayout Orientation="Horizontal">
<m:SearchEntry Placeholder="Nom"  BackgroundColor="White" TextColor="Black" SqlParam="@c_nom" HorizontalOptions="FillAndExpand" />
<m:SearchEntry Placeholder="Code postal" WidthRequest="120" BackgroundColor="White" TextColor="Black" SqlParam="@c_codep" HorizontalOptions="End" />
</StackLayout>
<m:SearchButton Text="Chercher Client" HorizontalOptions="Center" />
</StackLayout>

Cela produira cet écran dans l'appareil mobile  


Des informations exhaustives concernant XAML peuvent être obtenues sur cette page du site de Xamarin. Toutefois, l'utilisation dans Mercator est relativement simple. Nous suggérons davantage de se reporter aux nombreux exemples qui sont mis à disposition sur notre site web afin de comprendre comment les composants d'interface sont mis en oeuvre. Les seuls concepts qui doivent être abordés sont 

  • les conteneurs (StackLayout, Grid, ...)
  • les contrôles standards comme le Label, ainsi que les contrôles spécifiques à Mercator qui sont documentés sur cette page.

Ces concepts sont hors du périmètre du paramétrage de MercatorPenguin et ne doivent dès lors pas être abordés :

  • Compilation XAML
  • XAML Namespaces
  • Binding et propriétés attachées
  • Resource dictionaries
  • ...

 

Nos exemples utilisent abondamment le StackLayout. Il s'agit d'un conteneur qui permet d'arranger les objets qu'il contient, soit verticalement, soit horizontalement. Son avantage est qu'il est responsive : il s'adapte donc à la taille physique de l'écran. Il est possible d'imbriquer des StackLayouts sur plusieurs niveaux.

Quelques-uns de nos exemples utilisent aussi avantageusement le Grid. Il permet de définir un conteneur organisé avec un nombre fixe de colonnes et un nombre fixe de lignes. Chaque contrôle peut ensuite être placé dans une cellule de la grille. 

Les autres types de conteneurs peuvent être utilisés.

Cette page donne des explications complémentaires concernant les couleurs.

Cette page traite du cas particulier des images.

 

Dans l'écran de paramétrage des bundles de Mercator, ce bouton permet d'afficher une palette montrant les commandes XAML les plus courantes pour le paramétrage de MercatorPenguin. Il suffit de les tirer dans l'éditeur XAML (drag & drop).

 


 

Informations complémentaires