Les Styles en XAML sont comparables aux styles en HTML5 : il s’agit d’une définition, au sein de la balise ou dans une zone dédié, permettant de lister les caractéristiques graphiques de composants d’interface.

Les Templates définissent quant à eu la structure d’affichage des données.

Styles

Dans l’élément :

<TextBlock HorizontalAlignment="Left" Margin="251,143,0,0" TextWrapping="Wrap" Text="Le texte" VerticalAlignment="Top"/>

L’élément TextBlock prend ici des attributs de style définit au sein de la balise.

Dans la zone dédié « resources »

Le style peut être définit dans la zone Resource de la page. A ce compte la, il doit nécessairement comporté un x:Key qui l’identifie et le control doit le mentionné.

<Window.Resources>
  <!-- Un style globale à différents éléments de la page -->
  <Style x:Key="MesStyles"><!-- Le x:Key est obligatoire -->
    <Setter Property="TextBlock.FontFamily" Value="Calibri" /> <!-- la propriété ne concernent que tous les éléments Text -->
  </Style>
</Window.Resouces>

<TextBlock Style="{StaticResource MesStyles}" />

Mais les Styles peuvent aussi être appliqués qu’à un type d’éléments. A ce compte là, le x:Key est défini implicitement car il n’est pas nécessaire de lié le Type de Contrôle au style.

<Window.Resources>
  <!-- Un style globale à tous les TextBlocks -->
  <Style TargetType="TextBlock"><!-- le x:Key est implicitement définit à {StaticResource {x:Type TextBlock}} -->
    <Setter Property="FontFamily" Value="Calibri" />
    <Setter Property="FontSize" Value="14" />
  </Style>
  <!-- Un style avec une x:Key définit : ne s'appliquera qu'au éléments qui indique explicitement l'utiliser -->
  <!-- De plus, l'attribut BasedOn permet d'hériter des caractéristique d'une autre ressource -->
  <Style x:Key="TitleText" BasedOn="{StaticResource {x:Type TextBlock}}" TargetType="TextBlock">
    <Setter Property="FontSize" Value="26" />
    <Setter Property="Foreground">
      <Setter.Value>
        <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1">
          <LinearGradientBrush.GradientStops>
            <GradientStop Offset="0.0" Color="Green" />
            <GradientStop Offset="1.0" Color="Black" />
          </LinearGradientBrush.GradientStops>
        </LinearGradientBrush>
      </Setter.Value>
    </Setter>
  </Style>
</Window.Resources>

En programmation

Un style peut aussi être appliqué à un élément via programmation.

//Récupéré depuis la définition dans les Resources XAML
Style ProgTextStyle = (Style) this.Resources["ProgTextStyle"];
TextBlockProg.Style = ProgTextStyle;

//Créé dans le code
Style newProgTextStyle = new Style();
Setter stFamily = new Setter();
stFamily.Property = Control.FontFamilyProperty;
stFamily.Value = new FontFamily("Comic Sans MS");
newProgTextStyle.Setters.Add(stFamily);
TextBlockProg.Style = newProgTextStyle;

Attention toutefois : à la différence avec le HTML5, les Styles Xaml ne peuvent être modifié sur l’élements une fois attribué. En cas de modification, il faut réaffecté un nouveau Style à l’élément.

Les Templates (Modèles de données)

Voir article sur les DataTemplates, le système de Template XAML

Sources

https://docs.microsoft.com/fr-fr/dotnet/framework/wpf/controls/styling-and-templating