Application d'un style et création de modèlesStyling and Templating

L’application d'un style et la création de modèles Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) font référence à une suite de fonctionnalités (styles, modèles, déclencheurs et tables de montage séquentiel) qui permettent aux développeurs et aux concepteurs de créer des effets visuellement attrayants et un aspect cohérent pour leur produit.Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) styling and templating refer to a suite of features (styles, templates, triggers, and storyboards) that allow developers and designers to create visually compelling effects and to create a consistent appearance for their product. Bien que les développeurs et/ou les concepteurs puissent largement personnaliser une à une l’apparence de leur application, il est essentiel d’utiliser un modèle de création de style et de modèle suffisamment robuste pour conserver et partager l’apparence dans une même application et entre différentes applications.Although developers and or designers can customize the appearance extensively on an application-by-application basis, a strong styling and templating model is necessary to allow maintenance and sharing of the appearance within and among applications. Windows Presentation Foundation (WPF)Windows Presentation Foundation (WPF) fournit ce modèle.provides that model.

La séparation de la présentation et de la logique est une autre fonctionnalité du modèle d’application de style WPFWPF.Another feature of the WPFWPF styling model is the separation of presentation and logic. Les concepteurs peuvent ainsi travailler sur l’apparence d’une application en utilisant uniquement XAMLXAML, tout en laissant les développeurs travailler sur la logique de programmation à l’aide de C# ou de Visual Basic.This means that designers can work on the appearance of an application by using only XAMLXAML at the same time that developers work on the programming logic by using C# or Visual Basic.

Cette présentation se concentre sur les aspects liés à la création de style et de modèle pour l’application et ne traite pas des concepts de liaison de données.This overview focuses on the styling and templating aspects of the application and does not discuss any data binding concepts. Pour plus d’informations sur la liaison de données, consultez Vue d’ensemble de la liaison de données.For information about data binding, see Data Binding Overview.

En outre, il est important de comprendre les ressources qui permettent de réutiliser les styles et les modèles.In addition, it is important to understand resources, which are what enable styles and templates to be reused. Pour plus d’informations sur les ressources, consultez Ressources XAML.For more information about resources, see XAML Resources.

Exemple de style et de modèleStyling and Templating Sample

Les exemples de code utilisés dans cette présentation s’appuient sur un exemple de photo simple affiché dans l’illustration suivante :The code examples used in this overview are based on a simple photo sample shown in the following illustration:

Styled ListViewStyled ListView

Cet exemple de photo simple utilise des styles et des modèles pour créer une expérience utilisateur visuellement attrayante.This simple photo sample uses styling and templating to create a visually compelling user experience. L’exemple a deux TextBlock éléments et un ListBox contrôle qui est lié à une liste d’images.The sample has two TextBlock elements and a ListBox control that is bound to a list of images. Pour accéder à l’exemple complet, consultez la page Introduction to Styling and Templating Sample (Présentation d’un exemple de création de style et de modèle).For the complete sample, see Introduction to Styling and Templating Sample.

Principes de base d’un styleStyle Basics

Vous pouvez considérer un Style comme un moyen pratique d’appliquer un ensemble de valeurs de propriété à plusieurs éléments.You can think of a Style as a convenient way to apply a set of property values to more than one element. Par exemple, considérez les éléments suivants TextBlock éléments et leur apparence par défaut :For example, consider the following TextBlock elements and their default appearance:

<TextBlock>My Pictures</TextBlock>
<TextBlock>Check out my new pictures!</TextBlock>

Capture d’écran exemple de styleStyling sample screenshot

Vous pouvez modifier l’apparence par défaut en définissant des propriétés, telles que FontSize et FontFamily, sur chaque TextBlock élément directement.You can change the default appearance by setting properties, such as FontSize and FontFamily, on each TextBlock element directly. Toutefois, si vous souhaitez que votre TextBlock éléments partagent certaines propriétés, vous pouvez créer un Style dans le Resources section de votre XAMLXAML de fichiers, comme illustré ici :However, if you want your TextBlock elements to share some properties, you can create a Style in the Resources section of your XAMLXAML file, as shown here:

<Window.Resources>
<!--A Style that affects all TextBlocks-->
<Style TargetType="TextBlock">
  <Setter Property="HorizontalAlignment" Value="Center" />
  <Setter Property="FontFamily" Value="Comic Sans MS"/>
  <Setter Property="FontSize" Value="14"/>
</Style>
</Window.Resources>

Lorsque vous définissez la TargetType de votre style pour le TextBlock type, le style est appliqué à tous les le TextBlock éléments dans la fenêtre.When you set the TargetType of your style to the TextBlock type, the style is applied to all the TextBlock elements in the window.

Maintenant le TextBlock éléments apparaissent comme suit :Now the TextBlock elements appear as follows:

Capture d’écran exemple de styleStyling sample screenshot

Extension des stylesExtending Styles

Vous pouvez choisir de vos deux TextBlock éléments partagent certaines valeurs de propriété, comme le FontFamily et le texte centré HorizontalAlignment, mais vous souhaitez également le texte « My Pictures » comporte quelques propriétés supplémentaires.Perhaps you want your two TextBlock elements to share some property values, such as the FontFamily and the centered HorizontalAlignment, but you also want the text "My Pictures" to have some additional properties. Vous pouvez procéder en créant un nouveau style dérivé du premier style, comme illustré ici :You can do that by creating a new style that is based on the first style, as shown here:

<Window.Resources>
<!--A Style that extends the previous TextBlock Style-->
<!--This is a "named style" with an x:Key of TitleText-->
<Style BasedOn="{StaticResource {x:Type TextBlock}}"
       TargetType="TextBlock"
       x:Key="TitleText">
  <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="#90DDDD" />
          <GradientStop Offset="1.0" Color="#5BFFFF" />
        </LinearGradientBrush.GradientStops>
      </LinearGradientBrush>
    </Setter.Value>
  </Setter>
</Style>
</Window.Resources>

Notez que le style précédent est affecté à un x:Key.Notice that the previous style is given an x:Key. Pour appliquer le style, vous définissez le Style propriété sur votre TextBlock à la x:Key valeur, comme illustré ici :To apply the style, you set the Style property on your TextBlock to the x:Key value, as shown here:

<TextBlock Style="{StaticResource TitleText}" Name="textblock1">My Pictures</TextBlock>
<TextBlock>Check out my new pictures!</TextBlock>

Cela TextBlock style a maintenant un HorizontalAlignment valeur Center, un FontFamily valeur de Comic Sans MS, un FontSize valeur 26 et un Foreground la valeur la LinearGradientBrush indiqué dans l’exemple.This TextBlock style now has a HorizontalAlignment value of Center, a FontFamily value of Comic Sans MS, a FontSize value of 26, and a Foreground value set to the LinearGradientBrush shown in the example. Notez que ce paramètre remplace le FontSize valeur du style de base.Notice that it overrides the FontSize value of the base style. S’il existe plusieurs Setter définissent la même propriété un Style, le Setter qui est déclaré dernier est prioritaire.If there is more than one Setter setting the same property in a Style, the Setter that is declared last takes precedence.

L’exemple suivant montre ce que le TextBlock éléments maintenant ressembler à :The following shows what the TextBlock elements now look like:

Blocs de texte mis en forme avec des stylesStyled TextBlocks

Cela TitleText style étend le style qui a été créé pour le TextBlock type.This TitleText style extends the style that has been created for the TextBlock type. Vous pouvez également étendre un style qui comporte un x:Key à l’aide de la valeur x:Key.You can also extend a style that has an x:Key by using the x:Key value. Pour obtenir un exemple, consultez l’exemple fourni pour le BasedOn propriété.For an example, see the example provided for the BasedOn property.

Relation entre la propriété TargetType et l’attribut x: KeyRelationship of the TargetType Property and the x:Key Attribute

Comme indiqué dans le premier exemple, définissant le TargetType propriété TextBlock sans affecter le style un x:Key provoque le style à appliquer à tous les TextBlock éléments.As shown in the first example, setting the TargetType property to TextBlock without assigning the style an x:Key causes the style to be applied to all TextBlock elements. Dans ce cas, l’attribut x:Key a implicitement la valeur {x:Type TextBlock}.In this case, the x:Key is implicitly set to {x:Type TextBlock}. Cela signifie que si vous définissez explicitement la x:Key valeur sur n’importe quelle autre que {x:Type TextBlock}, le Style n’est pas appliquée à tous les TextBlock éléments automatiquement.This means that if you explicitly set the x:Key value to anything other than {x:Type TextBlock}, the Style is not applied to all TextBlock elements automatically. Au lieu de cela, vous devez appliquer le style (à l’aide de la x:Key valeur) à la TextBlock éléments explicitement.Instead, you must apply the style (by using the x:Key value) to the TextBlock elements explicitly. Si votre style se trouve dans la section des ressources et vous ne définissez pas la TargetType propriété sur votre style, vous devez fournir un x:Key.If your style is in the resources section and you do not set the TargetType property on your style, then you must provide an x:Key.

En plus de fournir une valeur par défaut pour le x:Key, le TargetType propriété spécifie le type auquel s’appliquent les propriétés d’accesseur Set.In addition to providing a default value for the x:Key, the TargetType property specifies the type to which setter properties apply. Si vous ne spécifiez pas un TargetType, vous devez qualifier les propriétés dans votre Setter objets avec un nom de classe en utilisant la syntaxe Property="ClassName.Property".If you do not specify a TargetType, you must qualify the properties in your Setter objects with a class name by using the syntax Property="ClassName.Property". Par exemple, au lieu de définir Property="FontSize", vous devez définir Property à "TextBlock.FontSize" ou "Control.FontSize".For example, instead of setting Property="FontSize", you must set Property to "TextBlock.FontSize" or "Control.FontSize".

Notez également que de nombreux contrôles WPFWPF se composent d’une combinaison d’autres contrôles WPFWPF.Also note that many WPFWPF controls consist of a combination of other WPFWPF controls. Si vous créez un style qui s’applique à tous les contrôles d’un type, vous pouvez obtenir des résultats inattendus.If you create a style that applies to all controls of a type, you might get unexpected results. Par exemple, si vous créez un style qui cible le TextBlock type dans un Window, le style est appliqué à tous les TextBlock contrôles dans la fenêtre, même si le TextBlock fait partie d’un autre contrôle, tel qu’un ListBox.For example, if you create a style that targets the TextBlock type in a Window, the style is applied to all TextBlock controls in the window, even if the TextBlock is part of another control, such as a ListBox.

Styles et ressourcesStyles and Resources

Vous pouvez utiliser un style sur tout élément qui dérive de FrameworkElement ou FrameworkContentElement.You can use a style on any element that derives from FrameworkElement or FrameworkContentElement. Le moyen le plus courant de déclarer un style consiste à le déclarer en tant que ressource dans la section Resources d’un fichier XAMLXAML, comme indiqué dans les exemples précédents.The most common way to declare a style is as a resource in the Resources section in a XAMLXAML file, as shown in the previous examples. Étant donné que les styles sont des ressources, ils obéissent aux mêmes règles de portée qui s’appliquent à toutes les ressources ; l’emplacement où vous déclarez un style affecte l’endroit où le style peut être appliqué.Because styles are resources, they obey the same scoping rules that apply to all resources; where you declare a style affects where the style can be applied. Par exemple, si vous déclarez le style dans l’élément racine du fichier XAMLXAML de votre définition d’application, le style peut être utilisé n’importe où dans votre application.For example, if you declare the style in the root element of your application definition XAMLXAML file, the style can be used anywhere in your application. Si vous créez une application de navigation et que vous déclarez le style dans un des fichiers XAMLXAML de l’application, le style ne pourra être utilisé que dans ce fichier XAMLXAML.If you create a navigation application and declare the style in one of the application's XAMLXAML files, the style can be used only in that XAMLXAML file. Pour plus d’informations sur les règles de portée des ressources, consultez Ressources XAML.For more information about scoping rules for resources, see XAML Resources.

Vous trouverez également d’autres informations sur les styles et les ressources dans la section Ressources et thèmes partagés plus loin dans cette vue d’ensemble.In addition, you can find more information about styles and resources in Shared Resources and Themes later in this overview.

Définir des styles par programmationSetting Styles Programmatically

Pour affecter un style nommé à un élément par programmation, obtenez le style de la collection de ressources et affectez-le à l’élément Style propriété.To assign a named style to an element programmatically, get the style from the resources collection and assign it to the element's Style property. Notez que les éléments dans une collection de ressources sont de type Object.Note that the items in a resources collection are of type Object. Par conséquent, vous devez effectuer un cast du style extrait sur un Style avant de l’assigner à la Style propriété.Therefore, you must cast the retrieved style to a Style before assigning it to the Style property. Par exemple, pour définir le texte défini TitleText style sur un TextBlock nommé textblock1, procédez comme suit :For example, to set the defined TitleText style on a TextBlock named textblock1, do the following:

textblock1.Style = (Style)(this.Resources["TitleText"]);
textblock1.Style = CType(Me.Resources("TitleText"), Style)

Notez qu’une fois qu’un style a été appliqué, il est scellé et ne peut pas être modifié.Note that once a style has been applied, it is sealed and cannot be changed. Si vous souhaitez modifier dynamiquement un style qui a déjà été appliqué, vous devez créer un nouveau style pour le remplacer.If you want to dynamically change a style that has already been applied, you must create a new style to replace the existing one. Pour plus d'informations, consultez la propriété IsSealed.For more information, see the IsSealed property.

Vous pouvez créer un objet qui choisit un style à appliquer selon une logique personnalisée.You can create an object that chooses a style to apply based on custom logic. Pour obtenir un exemple, consultez l’exemple fourni pour la StyleSelector classe.For an example, see the example provided for the StyleSelector class.

Liaisons, ressources dynamiques et gestionnaires d’événementsBindings, Dynamic Resources, and Event Handlers

Notez que vous pouvez utiliser la propriété Setter.Value pour spécifier une extension de balisage Binding ou une extension de balisage DynamicResource.Note that you can use the Setter.Value property to specify a Binding Markup Extension or a DynamicResource Markup Extension. Pour plus d’informations, consultez les exemples fournis pour le Setter.Value propriété.For more information, see the examples provided for the Setter.Value property.

Jusqu'à présent, cette présentation décrivait uniquement l’utilisation de méthodes setter pour définir la valeur de la propriété.So far, this overview only discusses the use of setters to set property value. Vous pouvez également spécifier des gestionnaires d’événements dans un style.You can also specify event handlers in a style. Pour plus d'informations, consultez EventSetter.For more information, see EventSetter.

Modèles de donnéesData Templates

Dans cet exemple d’application, il existe un ListBox contrôle qui est lié à une liste de photos :In this sample application, there is a ListBox control that is bound to a list of photos:

<ListBox ItemsSource="{Binding Source={StaticResource MyPhotos}}"
         Background="Silver" Width="600" Margin="10" SelectedIndex="0"/>

Cela ListBox actuellement ressemble à ceci :This ListBox currently looks like the following:

ListBox avant application du modèleListBox before applying template

La plupart des contrôles ont un type de contenu, et ce contenu provient souvent des données que vous liez à ces contrôles.Most controls have some type of content, and that content often comes from data that you are binding to. Dans cet exemple, les données sont la liste de photos.In this sample, the data is the list of photos. Dans WPFWPF, vous utilisez un DataTemplate pour définir la représentation visuelle des données.In WPFWPF, you use a DataTemplate to define the visual representation of data. En fait, ce que vous placez dans un DataTemplate détermine ce que les données qui se présente comme dans l’application rendue.Basically, what you put into a DataTemplate determines what the data looks like in the rendered application.

Dans notre exemple d’application, chaque objet Photo personnalisé a une propriété Source de type chaîne qui spécifie le chemin d’accès à l’image.In our sample application, each custom Photo object has a Source property of type string that specifies the file path of the image. Actuellement, les objets photo apparaissent sous forme de chemins d’accès.Currently, the photo objects appear as file paths.

Pour les photos apparaissent sous forme d’images, vous créez un DataTemplate en tant que ressource :For the photos to appear as images, you create a DataTemplate as a resource:

<Window.Resources>
<!--DataTemplate to display Photos as images
    instead of text strings of Paths-->
<DataTemplate DataType="{x:Type local:Photo}">
  <Border Margin="3">
    <Image Source="{Binding Source}"/>
  </Border>
</DataTemplate>
</Window.Resources>

Notez que le DataType propriété est très similaire à la TargetType propriété de la Style.Notice that the DataType property is very similar to the TargetType property of the Style. Si votre DataTemplate est dans la section de ressources, lorsque vous spécifiez le DataType à un type de propriété sans lui assigner un x:Key, le DataTemplate est appliqué chaque fois que ce type apparaît.If your DataTemplate is in the resources section, when you specify the DataType property to a type and not assign it an x:Key, the DataTemplate is applied whenever that type appears. Vous avez toujours la possibilité d’affecter la DataTemplate avec un x:Key et définissez-le comme un StaticResource pour les propriétés qui acceptent DataTemplate types, tels que le ItemTemplate propriété ou le ContentTemplate propriété.You always have the option to assign the DataTemplate with an x:Key and then set it as a StaticResource for properties that take DataTemplate types, such as the ItemTemplate property or the ContentTemplate property.

Essentiellement, le DataTemplate dans l’exemple ci-dessus définit que chaque fois qu’il est un Photo de l’objet, il doit apparaître en tant qu’un Image au sein d’un Border.Essentially, the DataTemplate in the above example defines that whenever there is a Photo object, it should appear as an Image within a Border. Avec cette DataTemplate, notre application se présente maintenant comme suit :With this DataTemplate, our application now looks like this:

Image photoPhoto image

Le modèle de création de modèles fournit d’autres fonctionnalités.The data templating model provides other features. Par exemple, si vous affichez les données de collection qui contient d’autres collections à l’aide un HeaderedItemsControl tapez comme un Menu ou un TreeView, il est le HierarchicalDataTemplate.For example, if you are displaying collection data that contains other collections using a HeaderedItemsControl type such as a Menu or a TreeView, there is the HierarchicalDataTemplate. Une autre fonctionnalité de création de modèles de données est la DataTemplateSelector, qui vous permet de choisir un DataTemplate à utiliser selon une logique personnalisée.Another data templating feature is the DataTemplateSelector, which allows you to choose a DataTemplate to use based on custom logic. Pour plus d’informations, consultez l’article Vue d'ensemble des modèles de données, qui fournit une discussion plus approfondie sur les différentes fonctionnalités de création de modèles de données.For more information, see Data Templating Overview, which provides a more in-depth discussion of the different data templating features.

Modèles de contrôleControl Templates

Dans WPFWPF, le ControlTemplate d’un contrôle définit l’apparence du contrôle.In WPFWPF, the ControlTemplate of a control defines the appearance of the control. Vous pouvez modifier la structure et l’apparence d’un contrôle en définissant un nouveau ControlTemplate pour le contrôle.You can change the structure and appearance of a control by defining a new ControlTemplate for the control. Dans de nombreux cas, cela vous donne suffisamment de souplesse pour ne pas avoir à écrire vos propres contrôles personnalisés.In many cases, this gives you enough flexibility so that you do not have to write your own custom controls. Pour plus d’informations, consultez Personnalisation de l'apparence d'un contrôle existant en créant un ControlTemplate.For more information, see Customizing the Appearance of an Existing Control by Creating a ControlTemplate.

DéclencheursTriggers

Un déclencheur définit des propriétés ou démarre des actions, par exemple une animation, lorsqu’une valeur de propriété change ou lorsqu’un événement est déclenché.A trigger sets properties or starts actions, such as an animation, when a property value changes or when an event is raised. Style, ControlTemplate, et DataTemplate ont toutes un Triggers propriété pouvant contenir un ensemble de déclencheurs.Style, ControlTemplate, and DataTemplate all have a Triggers property that can contain a set of triggers. Il existe différents types de déclencheurs.There are various types of triggers.

Déclencheurs de propriétéProperty Triggers

A Trigger que jeux de valeurs de propriété ou démarre des actions selon la valeur d’une propriété est appelé un déclencheur de propriété.A Trigger that sets property values or starts actions based on the value of a property is called a property trigger.

Pour illustrer comment utiliser des déclencheurs de propriété, vous pouvez rendre chaque ListBoxItem partiellement transparent, sauf s’il est sélectionné.To demonstrate how to use property triggers, you can make each ListBoxItem partially transparent unless it is selected. Le style suivant affecte le Opacity valeur d’un ListBoxItem à 0.5.The following style sets the Opacity value of a ListBoxItem to 0.5. Lorsque le IsSelected propriété est true, toutefois, le Opacity est défini sur 1.0:When the IsSelected property is true, however, the Opacity is set to 1.0:

<Style TargetType="ListBoxItem">
  <Setter Property="Opacity" Value="0.5" />
  <Setter Property="MaxHeight" Value="75" />
  <Style.Triggers>
    <Trigger Property="IsSelected" Value="True">
        <Setter Property="Opacity" Value="1.0" />
    </Trigger>
  </Style.Triggers>
</Style>

Cet exemple utilise un Trigger pour définir une valeur de propriété, mais notez que la Trigger classe a également la EnterActions et ExitActions propriétés qui permettent à un déclencheur effectuer des actions.This example uses a Trigger to set a property value, but note that the Trigger class also has the EnterActions and ExitActions properties that enable a trigger to perform actions.

Notez que le MaxHeight propriété de la ListBoxItem est défini sur 75.Notice that the MaxHeight property of the ListBoxItem is set to 75. Dans l’illustration suivante, le troisième élément est l’élément sélectionné :In the following illustration, the third item is the selected item:

Styled ListViewStyled ListView

EventTriggers et tables de montage séquentielEventTriggers and Storyboards

Un autre type de déclencheur est le EventTrigger, qui lance un ensemble d’actions en fonction de l’occurrence d’un événement.Another type of trigger is the EventTrigger, which starts a set of actions based on the occurrence of an event. Par exemple, ce qui suit EventTrigger objets spécifient que lorsque le pointeur de la souris entre dans le ListBoxItem, la MaxHeight propriété s’anime à une valeur de 90 sur un 0.2 seconde période.For example, the following EventTrigger objects specify that when the mouse pointer enters the ListBoxItem, the MaxHeight property animates to a value of 90 over a 0.2 second period. Lorsque la souris s’éloigne de l’élément, la propriété retourne à sa valeur d’origine pendant une période de 1 seconde.When the mouse moves away from the item, the property returns to the original value over a period of 1 second. Notez qu’il n’est pas nécessaire de spécifier un To valeur pour le MouseLeave animation.Note how it is not necessary to specify a To value for the MouseLeave animation. L’animation est en effet capable d’effectuer le suivi de la valeur d’origine.This is because the animation is able to keep track of the original value.

<EventTrigger RoutedEvent="Mouse.MouseEnter">
  <EventTrigger.Actions>
    <BeginStoryboard>
      <Storyboard>
        <DoubleAnimation
          Duration="0:0:0.2"
          Storyboard.TargetProperty="MaxHeight"
          To="90"  />
      </Storyboard>
    </BeginStoryboard>
  </EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="Mouse.MouseLeave">
  <EventTrigger.Actions>
    <BeginStoryboard>
      <Storyboard>
        <DoubleAnimation
          Duration="0:0:1"
          Storyboard.TargetProperty="MaxHeight"  />
      </Storyboard>
    </BeginStoryboard>
  </EventTrigger.Actions>
</EventTrigger>

Pour plus d’informations, consultez l’article Vue d’ensemble des storyboards.For more information, see the Storyboards Overview.

Dans l’illustration suivante, la souris pointe sur le troisième élément :In the following illustration, the mouse is pointing to the third item:

Capture d’écran exemple de styleStyling sample screenshot

MultiTriggers, DataTriggers et MultiDataTriggersMultiTriggers, DataTriggers, and MultiDataTriggers

En plus de Trigger et EventTrigger, il existe d’autres types de déclencheurs.In addition to Trigger and EventTrigger, there are other types of triggers. MultiTrigger vous permet de définir des valeurs de propriété selon plusieurs conditions.MultiTrigger allows you to set property values based on multiple conditions. Vous utilisez DataTrigger et MultiDataTrigger lorsque la propriété de votre condition est liée aux données.You use DataTrigger and MultiDataTrigger when the property of your condition is data-bound.

Ressources et thèmes partagésShared Resources and Themes

Une application Windows Presentation Foundation (WPF) classique peut avoir plusieurs ressources d’interface utilisateur utilisateur qui sont appliquées dans toute l’application.A typical Windows Presentation Foundation (WPF) application might have multiple user interface (UI) resources that are applied throughout the application. Collectivement, cet ensemble de ressources peut être considéré comme le thème de l’application.Collectively, this set of resources can be considered the theme for the application. Windows Presentation Foundation (WPF) prend en charge pour l’utilisateur de l’empaquetage ressources d’interface (UI) comme un thème à l’aide d’un dictionnaire de ressources encapsulé en tant que la ResourceDictionary classe.Windows Presentation Foundation (WPF) provides support for packaging user interface (UI) resources as a theme by using a resource dictionary that is encapsulated as the ResourceDictionary class.

Thèmes de Windows Presentation Foundation (WPF) sont définies en utilisant le style et le mécanisme de création de modèles Windows Presentation Foundation (WPF) expose pour la personnalisation des visuels de tout élément.Windows Presentation Foundation (WPF) themes are defined by using the styling and templating mechanism that Windows Presentation Foundation (WPF) exposes for customizing the visuals of any element.

Ressources de thème Windows Presentation Foundation (WPF) sont stockées dans les dictionnaires de ressources incorporé.Windows Presentation Foundation (WPF) theme resources are stored in embedded resource dictionaries. Ces dictionnaires de ressources doivent être incorporés dans un assembly signé, et peuvent être incorporés dans le même assembly que le code lui-même, ou bien dans un assembly parallèle.These resource dictionaries must be embedded within a signed assembly, and can either be embedded in the same assembly as the code itself or in a side-by-side assembly. Dans le cas de PresentationFramework.dll, l’assembly qui contient des contrôles Windows Presentation Foundation (WPF), les ressources de thème se trouvent dans une série d’assemblys côte à côte.In the case of PresentationFramework.dll, the assembly which contains Windows Presentation Foundation (WPF) controls, theme resources are in a series of side-by-side assemblies.

Le thème est alors le dernier emplacement à consulter lors de la recherche du style d’un élément.The theme becomes the last place to look when searching for the style of an element. En règle générale, la recherche commence en remontant l’arborescence d’éléments pour rechercher une ressource appropriée, avant de consulter la collection de ressources d’application et d’interroger pour finir le système.Typically, the search will begin by walking up the element tree searching for an appropriate resource, then look in the application resource collection and finally query the system. Cela permet aux développeurs d’applications de redéfinir le style pour n’importe quel objet au niveau de l’arborescence ou de l’application avant d’atteindre le thème.This gives application developers a chance to redefine the style for any object at the tree or application level before reaching the theme.

Vous pouvez définir des dictionnaires de ressources sous forme de fichiers individuels qui vous permettent de réutiliser un thème entre plusieurs applications.You can define resource dictionaries as individual files that enable you to reuse a theme across multiple applications. Vous pouvez également créer des thèmes permutables en définissant plusieurs dictionnaires de ressources qui fournissent les mêmes types de ressources mais avec des valeurs différentes.You can also create swappable themes by defining multiple resource dictionaries that provide the same types of resources but with different values. Pour définir l’apparence une application, il est recommandé de redéfinir ces styles ou d’autres ressources au niveau de l’application.Redefining these styles or other resources at the application level is the recommended approach for skinning an application.

Pour partager un ensemble de ressources, y compris les styles et modèles, entre les applications, vous pouvez créer un XAMLXAML de fichiers et de définir un ResourceDictionary.To share a set of resources, including styles and templates, across applications, you can create a XAMLXAML file and define a ResourceDictionary. Par exemple, observez l’illustration suivante qui montre une partie de l’exemple de style avec ControlTemplates :For example, take a look at the following illustration that shows part of the Styling with ControlTemplates Sample:

Exemples de modèle de contrôleControl Template Examples

Si vous examinez les fichiers XAMLXAML de l’exemple, vous remarquerez qu’ils comportent tous les éléments suivants :If you look at the XAMLXAML files in the sample, you will notice that the files all have the following:

<ResourceDictionary.MergedDictionaries>
  <ResourceDictionary Source="Shared.xaml" />
</ResourceDictionary.MergedDictionaries>

C’est le partage de shared.xaml, qui définit un ResourceDictionary qui contient un ensemble de ressources de style et pinceau qui active les contrôles dans l’exemple pour obtenir une apparence cohérente.It is the sharing of shared.xaml, which defines a ResourceDictionary that contains a set of style and brush resources that enables the controls in the sample to have a consistent look.

Pour plus d’informations, consultez Dictionnaires de ressources fusionnés.For more information, see Merged Resource Dictionaries.

Si vous créez un thème pour votre contrôle personnalisé, consultez la section relative aux bibliothèques de contrôles externes de la page Vue d'ensemble de la création de contrôles.If you are creating a theme for you custom control, see the External Control Library section of the Control Authoring Overview.

Voir aussiSee also