WPF - Présentation de XAML

L'une des premières choses que vous rencontrerez en travaillant avec WPF est XAML. XAML signifie Extensible Application Markup Language. C'est un langage simple et déclaratif basé sur XML.

En XAML, il est très facile de créer, d'initialiser et de définir des propriétés d'objets avec des relations hiérarchiques.
Il est principalement utilisé pour concevoir des interfaces graphiques, mais il peut également être utilisé à d'autres fins, par exemple, pour déclarer un flux de travail dans Workflow Foundation.

Syntaxe de base

Lorsque vous créez votre nouveau projet WPF, vous rencontrez une partie du code XAML par défaut dans MainWindow.xaml, comme indiqué ci-dessous.

<Window x:Class = "Resources.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   Title = "MainWindow" Height = "350" Width = "525"> 
	
   <Grid> 
         
   </Grid> 
	
</Window>

Le fichier XAML ci-dessus contient différents types d'informations. Le tableau suivant explique brièvement le rôle de chaque information.

Information	La description
<Fenêtre	C'est l'élément d'objet d'ouverture ou le conteneur de la racine.
x: Class = "Resources.MainWindow"	Il s'agit d'une déclaration de classe partielle qui connecte le balisage au code de classe partiel défini derrière.
xmlns = "http://schemas.microsoft.com/win fx / 2006 / xaml / presentation"	Mappe l'espace de noms XAML par défaut pour le client / framework WPF
xmlns: x = "http://schemas.microsoft.com/w infx / 2006 / xaml"	Espace de noms XAML pour le langage XAML qui le mappe au préfixe x:
>	Fin de l'élément objet de la racine
<Grille> </Grid>	Il démarre et ferme les balises d'un objet de grille vide.
</Window>	Fermer l'élément objet

Les règles de syntaxe pour XAML sont presque similaires à XML. Si vous regardez un document XAML, vous remarquerez qu'il s'agit en fait d'un fichier XML valide, mais qu'un fichier XML n'est pas nécessairement un fichier XAML. C'est parce qu'en XML, la valeur des attributs doit être une chaîne tandis qu'en XAML, il peut s'agir d'un objet différent appelé syntaxe d'élément Property.

La syntaxe d'un élément Object commence par un crochet angulaire gauche (<) suivi du nom d'un objet, par exemple Button.
Définissez certaines propriétés et attributs de cet élément d'objet.
L'élément Object doit être fermé par une barre oblique (/) suivie immédiatement d'un crochet à angle droit (>).

Exemple d'objet simple sans élément enfant

<Button/>

Exemple d'élément objet avec quelques attributs

<Button Content = "Click Me" Height = "30" Width = "60" />

Exemple de syntaxe alternative pour définir les propriétés (syntaxe de l'élément Property)

<Button> 
   <Button.Content>Click Me</Button.Content> 
   <Button.Height>30</Button.Height> 
   <Button.Width>60</Button.Width> 
</Button>

Exemple d'objet avec élément enfant: StackPanel contient Textblock comme élément enfant

<StackPanel Orientation = "Horizontal"> 
   <TextBlock Text = "Hello"/> 
</StackPanel>

Pourquoi XAML dans WPF

XAML n'est pas seulement la fonctionnalité la plus connue de WPF, mais c'est aussi l'une des fonctionnalités les plus mal comprises. Si vous êtes exposé à WPF, vous devez avoir entendu parler de XAML; mais prenez note des deux faits moins connus suivants sur XAML -

WPF n'a pas besoin de XAML
XAML n'a pas besoin de WPF

Ce sont en fait des éléments technologiques séparables. Pour comprendre comment cela peut être, examinons un exemple simple dans lequel un bouton est créé avec certaines propriétés en XAML.

<Window x:Class = "WPFXAMLOverview.MainWindow" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml"
   Title = "MainWindow" Height = "350" Width = "604"> 
	
   <StackPanel> 
      <Button x:Name = "button" Content = "Click Me" HorizontalAlignment = "Left"  
         Margin = "150" VerticalAlignment = "Top" Width = "75" /> 
   </StackPanel> 
	
</Window>

Si vous choisissez de ne pas utiliser XAML dans WPF, vous pouvez également obtenir le même résultat GUI avec un langage procédural. Regardons le même exemple, mais cette fois, nous allons créer un bouton en C #.

using System.Windows; 
using System.Windows.Controls;  

namespace WPFXAMLOverview { 
   /// <summary> 
      /// Interaction logic for MainWindow.xaml 
   /// </summary> 
	
   public partial class MainWindow : Window { 
	
      public MainWindow() { 
         InitializeComponent(); 
			
         // Create the StackPanel 
         StackPanel stackPanel = new StackPanel(); 
         this.Content = stackPanel; 
			
         // Create the Button 
         Button button = new Button();
         button.Content = "Click Me"; 
         button.HorizontalAlignment = HorizontalAlignment.Left; 
         button.Margin = new Thickness(150); 
         button.VerticalAlignment = VerticalAlignment.Top; 
         button.Width = 75; 
         stackPanel.Children.Add(button);  
      } 
   } 
}

Lorsque vous compilez et exécutez le code XAML ou le code C #, vous verrez la même sortie que celle illustrée ci-dessous.

À partir de l'exemple ci-dessus, il est clair que ce que vous pouvez faire en XAML pour créer, initialiser et définir les propriétés des objets, les mêmes tâches peuvent également être effectuées à l'aide de code.

XAML n'est qu'un autre moyen simple et facile de concevoir des éléments d'interface utilisateur.
Avec XAML, cela ne signifie pas que ce que vous pouvez faire pour concevoir des éléments d'interface utilisateur est le seul moyen. Vous pouvez déclarer les objets en XAML ou les définir à l'aide de code.
XAML est facultatif, mais malgré cela, il est au cœur de la conception WPF.
Le but de XAML est de permettre aux concepteurs visuels de créer directement des éléments d'interface utilisateur.
WPF vise à permettre de contrôler tous les aspects visuels de l'interface utilisateur à partir du balisage.

↰ Previous page Next page ↱