Partager via


Vue d'ensemble du rendu graphique de WPF

Cette rubrique propose une vue d'ensemble de la couche visuelle de WPF. Elle se concentre sur le rôle de la classe Visual pour la prise en charge du rendu dans le modèle WPF.

Cette rubrique comprend les sections suivantes.

  • Rôle de l'objet visuel
  • Comment les objets visuels sont utilisés pour générer des contrôles
  • Arborescence d'éléments visuels
  • Comportement de rendu visuel
  • Classe VisualTreeHelper
  • Rubriques connexes

Rôle de l'objet visuel

La classe Visual est l'abstraction de base de laquelle dérive chaque objet FrameworkElement. Elle sert également de point d'entrée pour l'écriture de nouveaux contrôles dans WPF et peut, par bien des aspects, être considérée comme le descripteur de fenêtre (HWND) dans le modèle d'application Win32.

L'objet Visual est un objet WPF principal; dont le rôle est de fournir une prise en charge du rendu. Les contrôles d'interface utilisateur, tels que Button et TextBox, dérivent de la classe Visual et l'utilisent pour rendre leurs données de rendu persistantes. L'objet Visual fournit une prise en charge pour :

  • L'affichage de sortie : rendu du contenu de dessin sérialisé persistant d'un visuel.

  • Transformations : exécution de transformations sur un objet visuel

  • Le découpage : fourniture d'une prise en charge d'une zone de découpage d'un visuel.

  • Le test d'atteinte : déterminer si une coordonnée ou une géométrie est contenue dans les limites d'un visuel.

  • Les calculs du cadre englobant : déterminer le rectangle englobant d'un visuel.

Cependant, l'objet Visual n'inclut pas la prise en charge pour les fonctionnalités n'effectuant pas de rendu, telles que :

  • Gestion des événements

  • Disposition

  • Styles

  • Liaison des données

  • Globalisation

Visual est exposé comme classe publique abstraite à partir de laquelle doivent être dérivées les classes enfants. L'illustration suivante montre la hiérarchie des objets visuels exposés dans WPF.

Hiérarchie de classe visuelle

Diagramme des classes dérivées de l'objet Visual

Classe DrawingVisual

DrawingVisual est une classe de dessin légère utilisée pour le rendu des formes, des images ou du texte. Cette classe est considérée comme légère car elle ne fournit pas la disposition ou la gestion d'événements, ce qui améliore ses performances au moment de l'exécution. Pour cette raison, les dessins sont idéaux pour les arrière-plans et les images clipart. Le DrawingVisual peut être utilisé pour créer un objet visuel personnalisé. Pour plus d'informations, consultez Utilisation d'objets DrawingVisual.

Classe Viewport3DVisual

La classe Viewport3DVisual fournit un pont entre les objets 2D Visual et Visual3D. La classe Visual3D est la classe de base pour tous les éléments visuels 3D. La classe Viewport3DVisual nécessite que vous définissiez une valeur Camera et une valeur Viewport. La caméra pour permet de visionner la scène. La fenêtre d'affichage établit où se mappe la projection sur la surface 2D. Pour plus d'informations sur la 3D dans WPF, consultez Vue d'ensemble des graphiques 3D.

Classe ContainerVisual

La classe ContainerVisual est utilisée comme un conteneur pour une collection d'objets Visual. La classe DrawingVisual dérive de la classe ContainerVisual, lui permettant de contenir une collection d'objets visuels.

Dessin de contenu dans des objets visuels

Un objet Visual stocke ses données de rendu en tant que liste d'instructions graphiques vectorielles. Chaque élément de la liste d'instructions représente un groupe de données graphiques bas niveau et de ressources associées dans un format sérialisé. Il existe quatre types de données de rendu différents pouvant contenir du contenu de dessin.

Type de contenu de dessin

Description

Graphiques vectoriels

Représente des données graphiques vectorielles et toute information de Brush et de Pen associée.

Image

Représente une image dans une région définie par un Rect.

Glyphe

Représente un dessin qui restitue un GlyphRun, qui est une séquence de glyphes provenant d'une ressource de police spécifiée. Voici comment est représenté le texte.

Vidéo

Représente un dessin qui restitue de la vidéo.

Le DrawingContext vous permet de remplir un Visual avec un contenu visuel. Lorsque vous utilisez les commandes de dessin d'un objet DrawingContext, vous stockez réellement un groupe de données de rendu qui seront utilisées ultérieurement par le système graphique ; vous ne dessinez pas à l'écran en temps réel.

Lorsque vous créez un contrôle WPF, tel qu'un Button, le contrôle génère implicitement les données de rendu pour se dessiner. Par exemple, le paramétrage de la propriété Content du Button entraîne le contrôle à stocker une représentation de rendu d'un glyphe.

Un Visual décrit son contenu comme un ou plusieurs objets Drawing contenus dans un DrawingGroup. Un DrawingGroup décrit également des masques d'opacité, des transformations, des effets bitmap et d'autres opérations appliquées à son contenu. Les opérations DrawingGroup sont appliquées dans l'ordre suivant lorsque le contenu est restitué : OpacityMask, Opacity, BitmapEffect, ClipGeometry, GuidelineSet, puis Transform.

L'illustration suivante montre l'ordre dans lequel les opérations du DrawingGroup sont appliquées pendant la séquence de rendu.

Ordre des opérations du DrawingGroup

ordre des opérations DrawingGroup

Pour plus d'informations, consultez Vue d'ensemble des objets Drawing.

Dessin de contenu sur la couche visuelle

Vous n'instanciez jamais un DrawingContext directement ; vous pouvez toutefois acquérir un contexte de dessin de certaines méthodes, telles que DrawingGroup.Open et DrawingVisual.RenderOpen. L'exemple suivant récupère un DrawingContext d'un DrawingVisual et l'utilise pour dessiner un rectangle.

        ' Create a DrawingVisual that contains a rectangle.
        Private Function CreateDrawingVisualRectangle() As DrawingVisual
            Dim drawingVisual As New DrawingVisual()

            ' Retrieve the DrawingContext in order to create new drawing content.
            Dim drawingContext As DrawingContext = drawingVisual.RenderOpen()

            ' Create a rectangle and draw it in the DrawingContext.
            Dim rect As New Rect(New Point(160, 100), New Size(320, 80))
            drawingContext.DrawRectangle(Brushes.LightBlue, CType(Nothing, Pen), rect)

            ' Persist the drawing content.
            drawingContext.Close()

            Return drawingVisual
        End Function
// Create a DrawingVisual that contains a rectangle.
private DrawingVisual CreateDrawingVisualRectangle()
{
    DrawingVisual drawingVisual = new DrawingVisual();

    // Retrieve the DrawingContext in order to create new drawing content.
    DrawingContext drawingContext = drawingVisual.RenderOpen();

    // Create a rectangle and draw it in the DrawingContext.
    Rect rect = new Rect(new System.Windows.Point(160, 100), new System.Windows.Size(320, 80));
    drawingContext.DrawRectangle(System.Windows.Media.Brushes.LightBlue, (System.Windows.Media.Pen)null, rect);

    // Persist the drawing content.
    drawingContext.Close();

    return drawingVisual;
}

Énumération d'un dessin de contenu sur la couche visuelle

Outre leurs autres utilisations, les objets Drawing fournissent aussi un modèle d'objet pour énumérer le contenu d'un Visual.

RemarqueRemarque

Lorsque vous énumérez le contenu d'un visuel, vous récupérez des objets Drawing, et non pas la représentation sous-jacente des données rendues comme liste d'instructions graphiques vectorielles.

L'exemple suivant utilise la méthode GetDrawing pour récupérer la valeur DrawingGroup d'un Visual et l'énumérer.

public void RetrieveDrawing(Visual v)
{
    DrawingGroup dGroup = VisualTreeHelper.GetDrawing(v);
    EnumDrawingGroup(dGroup);

}

 // Enumerate the drawings in the DrawingGroup.
 public void EnumDrawingGroup(DrawingGroup drawingGroup)
 {
     DrawingCollection dc = drawingGroup.Children;

     // Enumerate the drawings in the DrawingCollection.
     foreach (Drawing drawing in dc)
     {
         // If the drawing is a DrawingGroup, call the function recursively.
         if (drawing.GetType() == typeof(DrawingGroup))
         {
             EnumDrawingGroup((DrawingGroup)drawing);
         }
         else if (drawing.GetType() == typeof(GeometryDrawing))
         {
             // Perform action based on drawing type.  
         }
         else if (drawing.GetType() == typeof(ImageDrawing))
         {
             // Perform action based on drawing type.
         }
         else if (drawing.GetType() == typeof(GlyphRunDrawing))
         {
             // Perform action based on drawing type.
         }
         else if (drawing.GetType() == typeof(VideoDrawing))
         {
             // Perform action based on drawing type.
         }
     }
 }

Comment les objets visuels sont utilisés pour générer des contrôles

De nombreux objets dans WPF sont composés d'autres objets visuels, ce qui signifie qu'ils peuvent contenir diverses hiérarchies d'objets descendants. De nombreux éléments de l'interface utilisateur dans WPF, tels que les contrôles, sont composés de plusieurs objets visuels représentant différents types d'éléments de rendu. Par exemple, le contrôle Button peut contenir plusieurs autres objets, y compris ClassicBorderDecorator, ContentPresenter et TextBlock.

Le code suivant montre un contrôle Button défini dans une balise.

<Button Click="OnClick">OK</Button>

Si vous deviez énumérer les objets visuels qui constituent le contrôle Button par défaut, vous trouveriez la hiérarchie d'objets visuels illustrée ci-dessous :

Diagramme d'une hiérarchie d'arborescence d'éléments visuels

Diagramme de la hiérarchie de l'arborescence d'éléments visuels

Le contrôle Button contient un élément ClassicBorderDecorator, qui à son tour, contient un élément ContentPresenter. L'élément ClassicBorderDecorator est responsable du dessin de la bordure et de l'arrière-plan pour le Button. L'élément ContentPresenter est responsable de l'affichage du contenu du Button. Dans ce cas, puisque vous affichez le texte, l'élément ContentPresenter contient un élément TextBlock. Le fait que le contrôle Button utilise un ContentPresenter signifie que le contenu peut être représenté par d'autres éléments, comme une Image ou une géométrie, comme une EllipseGeometry.

Modèles de contrôle

La clé de l'expansion d'un contrôle dans une hiérarchie de contrôles est le ControlTemplate. Un modèle de contrôle spécifie la hiérarchie visuelle par défaut pour un contrôle. Lorsque vous référencez explicitement un contrôle, vous référencez implicitement sa hiérarchie visuelle. Vous pouvez substituer les valeurs par défaut pour un modèle de contrôle afin de créer une apparence visuelle personnalisée pour un contrôle. Par exemple, vous pourriez modifier la valeur de couleur d'arrière-plan du contrôle Button afin qu'il utilise une valeur de couleur de dégradé linéaire à la place d'une valeur de couleur unie. Pour plus d'informations, consultez Styles et modèles Button.

Un élément d'interface utilisateur, comme un contrôle Button, contient plusieurs listes d'instructions graphiques vectorielles qui décrivent la définition de rendu complète d'un contrôle. Le code suivant montre un contrôle Button défini dans une balise.

<Button Click="OnClick">
  <Image Source="images\greenlight.jpg"></Image>
</Button>

Si vous deviez énumérer les objets visuels et les listes d'instructions graphiques vectorielles qui constituent le contrôle Button, vous trouveriez la hiérarchie d'objets visuels illustrée ci-dessous :

Diagramme d'une arborescence d'éléments visuels et d'éléments de rendu

Diagramme de l'arborescence d'éléments visuels et des données de rendu

Le contrôle Button contient un élément ClassicBorderDecorator, qui à son tour, contient un élément ContentPresenter. L'élément ClassicBorderDecorator est responsable du dessin de tous les éléments graphiques discrets qui composent la bordure et l'arrière-plan d'un bouton. L'élément ContentPresenter est responsable de l'affichage du contenu du Button. Dans ce cas, puisque vous affichez une image, l'élément ContentPresenter contient un élément Image.

Plusieurs points sont à noter concernant la hiérarchie d'objets visuels et de listes d'instructions graphiques vectorielles :

  • L'ordre de la hiérarchie représente l'ordre de rendu des informations de dessin. Depuis l'élément visuel racine, les éléments enfants sont parcourus de gauche à droite et de haut en bas. Si un élément comporte des éléments enfants, ils sont parcourus avant les éléments frères.

  • Les éléments de nœuds non terminaux dans la hiérarchie, comme un ContentPresenter, sont utilisés pour contenir les éléments enfants ; ils ne contiennent pas de listes d'instructions.

  • Si un élément visuel contient à la fois une liste d'instructions graphiques vectorielles et des enfants visuels, la liste d'instructions de l'élément visuel parent est restitué avant les dessins dans n'importe quel objet visuel enfant.

  • Les éléments dans la liste d'instructions graphiques vectorielles sont restituées de gauche à droite.

Arborescence d'éléments visuels

L'arborescence d'éléments visuels contient tous les éléments visuels utilisés dans l'interface graphique d'une application. Comme un élément visuel contient des informations de dessin persistantes, vous pouvez considérer l'arborescence d'éléments visuels comme étant un graphique de scène contenant toutes les informations rendues nécessaires pour composer la sortie vers le périphérique d'affichage. Cette arborescence est l'accumulation de tous les éléments visuels créés directement par l'application, par code ou dans une balise. L'arborescence d'éléments visuels contient tous les éléments visuels créés par l'expansion d'éléments du modèle tels que les contrôles et les objets de données.

Le code suivant montre un élément StackPanel défini dans une balise.

<StackPanel>
  <Label>User name:</Label>
  <TextBox />
  <Button Click="OnClick">OK</Button>
</StackPanel>

Si vous deviez énumérer les objets visuels qui constituent l'élément StackPanel dans l'exemple de balise, vous trouveriez la hiérarchie d'objets visuels illustrée ci-dessous :

Diagramme d'une hiérarchie d'arborescence d'éléments visuels

Diagramme de la hiérarchie de l'arborescence d'éléments visuels

Ordre de rendu

L'arborescence d'éléments visuels détermine l'ordre de rendu d'objets visuels et de dessin WPF. L'ordre de parcours démarre avec le visuel racine qui est le nœud le plus élevé dans l'arborescence d'éléments visuels. Les enfants du visuel racine sont ensuite parcourus de gauche à droite. Si un visuel a des enfants, ces derniers sont parcourus avant les visuels frères. Cela signifie que le contenu d'un visuel enfant est rendu devant le propre contenu du visuel.

Diagramme de l'ordre de rendu d'une arborescence d'éléments visuels

Diagramme de l'ordre de rendu de l'arborescence d'éléments visuels

Visuel racine

Le visuel racine est l'élément le plus élevé dans une hiérarchie d'arborescence d'éléments visuels. Dans la plupart des applications, la classe de base de l'élément racine est Window ou NavigationWindow. Cependant, si vous hébergez des objets visuels dans une application Win32, le visuel racine est le visuel le plus élevé que vous hébergez dans la fenêtre Win32. Pour plus d'informations, consultez Didacticiel : hébergement d'objets visuels dans une application Win32.

Relations avec l'arborescence logique

L'arborescence logique dans WPF représente les éléments d'une application au moment de l'exécution. Bien que vous ne manipulez pas directement l'arborescence, cette vue de l'application est pratique pour comprendre l'héritage de propriété et le routage d'événement. Contrairement à l'arborescence d'éléments visuels, l'arborescence logique peut représenter des objets de données non visuels, tels que ListItem. Dans de nombreux cas, l'arborescence logique se mappe très étroitement aux définitions de balise d'une application. Le code suivant montre un élément DockPanel défini dans une balise.

<DockPanel>
  <ListBox>
    <ListBoxItem>Dog</ListBoxItem>
    <ListBoxItem>Cat</ListBoxItem>
    <ListBoxItem>Fish</ListBoxItem>
  </ListBox>
  <Button Click="OnClick">OK</Button>
</DockPanel>

Si vous deviez énumérer les objets logiques qui constituent l'élément DockPanel dans l'exemple de balise, vous trouveriez la hiérarchie d'objets logiques illustrée ci-dessous :

Diagramme d'une arborescence logique

Diagramme de l'arborescence

L'arborescence d'éléments visuels et l'arborescence logique sont synchronisées avec le jeu actuel d'éléments d'application, reflétant tout ajout, suppression ou modification d'éléments. Toutefois, les arborescences présentent différentes vues de l'application. Contrairement à l'arborescence d'éléments visuels, l'arborescence logique ne développe pas l'élément d'un contrôle ContentPresenter. Cela signifie qu'il existe une correspondance directe un-à-un entre une arborescence logique et une arborescence d'éléments visuels pour le même ensemble d'objets. En réalité, l'appel de la méthode LogicalTreeHelper de l'objet GetChildren et la méthode VisualTreeHelper de l'objet GetChild à l'aide du même élément comme paramètre génère des résultats différents.

Pour plus d'informations sur l'arborescence logique, consultez Arborescences dans WPF.

Affichage de l'arborescence d'éléments visuels à l'aide de XamlPad

L'outil XamlPad de WPF offre une option d'affichage et d'exploration de l'arborescence d'éléments visuels qui correspond au contenu XAML actuellement défini. Cliquez sur le bouton Afficher l'arborescence d'éléments visuels dans la barre de menus pour afficher l'arborescence d'éléments visuels. L'exemple suivant montre le développement du contenu XAML en nœuds de l'arborescence d'éléments visuels dans le volet Explorateur d'arborescence d'éléments visuels de XamlPad :

Volet Explorateur de l'arborescence d'éléments visuels dans XamlPad

Volet Explorateur de l'arborescence d'éléments visuels dans XamlPad

Notez la manière dont chaque contrôle Label, TextBox et Button affiche une hiérarchie d'objet visuel distincte dans le volet Explorateur de l'arborescence d'éléments visuels de XamlPad. Cela tient au fait que les contrôles WPF possèdent un ControlTemplate qui contient l'arborescence d'éléments visuels de ce contrôle. Lorsque vous référencez explicitement un contrôle, vous référencez implicitement sa hiérarchie visuelle.

Profilage des performances visuelles

WPF fournit une suite d'outils de profilage des performances qui vous permettent d'analyser le comportement au moment de l'exécution de votre application et de déterminer les types d'optimisations des performances que vous pouvez appliquer. La suite d'outils Visual Profiler fournit une vue graphique détaillée des données de performance en mappant directement sur l'arborescence d'éléments visuels de l'application. Dans cette capture d'écran, la section Utilisation de l'UC de Visual Profiler donne un descriptif précis de l'utilisation d'un objet des services WPF, comme le rendu et la disposition.

Sortie d'affichage de Visual Profiler

Sortie du Générateur de profils Visual

Comportement de rendu visuel

WPF présente plusieurs fonctionnalités qui affectent le comportement de rendu d'objets visuels : graphiques en mode Conservation, graphiques vectoriels et graphiques indépendants du périphérique.

Graphiques en mode Conservation

Une des clés pour comprendre le rôle d'un objet visuel est de comprendre la différence entre les systèmes graphiques en mode Exécution et en mode Conservation. Une application Win32 standard à base de GDI ou GDI+ utilise un système de graphiques en mode Exécution. Cela signifie que c'est la responsabilité de l'application de repeindre la portion de la zone client qui est invalidée, en raison d'une action telle qu'un redimensionnement de fenêtre, ou la modification de l'apparence visuelle d'un objet.

Diagramme d'une séquence de rendu Win32

Diagramme de la séquence de rendu Win32

Par opposition, WPF utilise un système de mode Exécution. Cela signifie que les objets d'application qui ont une apparence visuelle définissent un ensemble de données de dessin sérialisées. Une fois que les données de dessin sont définies, le système est ensuite responsable de la réponse à toutes les demandes de peintures pour restituer les objets d'application. Même au moment de l'exécution, vous pouvez modifier ou créer des objets d'application, et toujours compter sur le système pour répondre aux demandes de peinture. La puissance d'un système de graphiques en mode Conservation réside dans le fait que les informations de dessin sont toujours persistantes dans un état sérialisé par l'application, mais que la responsabilité du rendu est laissée au système. Le diagramme suivant illustre comment l'application se repose sur WPF pour répondre aux demandes de peinture.

Diagramme d'une séquence de rendu WPF

Diagramme de la séquence de rendu WPF

Redessinage intelligent

L'un des principaux avantages de l'utilisation de graphiques en mode Conservation réside dans le fait que WPF peut optimiser efficacement ce qui doit être redessiné dans l'application. Même si vous avez une scène complexe avec différents niveaux d'opacité, vous n'avez généralement pas besoin d'écrire un code spécial dans ce but pour optimiser le redessinage. Faites la comparaison avec la programmation Win32 dans laquelle vous pouvez passer beaucoup de temps à optimiser votre application en minimisant la quantité de redessinage dans la région mise à jour. Consultez Redessinage dans la région mise à jour pour un exemple du type de complexité impliquée dans l'optimisation du redessinage dans les applications Win32.

Graphiques vectoriels

WPF utilise les graphiques vectoriels comme format de rendu de données. Les graphiques vectoriels, qui comprennent les Scalable Vector Graphics (SVG), les métafichiers Windows (.wmf) et les polices TrueType, stockent les données de rendu et les transmettent comme liste d'instructions décrivant comment recréer une image à l'aide de primitives graphiques. Par exemple, les polices TrueType sont des polices vectorielles qui décrivent un ensemble de lignes, de courbes et de commandes, plutôt qu'un tableau de pixels. L'un des avantages principaux des graphiques vectoriels est la possibilité de mettre à l'échelle dans n'importe quelle taille et résolution.

Contrairement aux graphiques vectoriels, les graphiques de bitmap stockent les données de rendu comme une représentation d'une image pixel par pixel, rendue au préalable pour une résolution spécifique. L'une des différences clé entre les formats graphiques de bitmap et vectoriels est la fidélité par rapport à l'image source d'origine. Par exemple, lorsque la taille d'une image source est modifiée, les systèmes de graphiques de bitmap étirent l'image, alors que les systèmes de graphiques vectoriels mettent l'image à l'échelle, préservant la fidélité de l'image.

L'illustration suivante montre une image source redimensionnée selon un facteur de 300 %. Remarquez les distorsions qui apparaissent lorsque l'image source est étirée comme une image graphique bitmap plutôt que mise à l'échelle comme une image de graphique vectoriel.

Différences entre les graphiques raster et vectoriels

Différences entre graphiques raster et vectoriels

La balise suivante montre deux éléments Path définis. Le deuxième élément utilise un ScaleTransform pour redimensionner les instructions de dessin du premier élément de 300 %. Notez que les instructions de dessin dans les éléments Path restent inchangées.

<Path
  Data="M10,100 C 60,0 100,200 150,100 z"
  Fill="{StaticResource linearGradientBackground}"
  Stroke="Black"
  StrokeThickness="2" />

<Path
  Data="M10,100 C 60,0 100,200 150,100 z"
  Fill="{StaticResource linearGradientBackground}"
  Stroke="Black"
  StrokeThickness="2" >
  <Path.RenderTransform>
    <ScaleTransform ScaleX="3.0" ScaleY="3.0" />
  </Path.RenderTransform>
</Path>

À propos des graphiques indépendants du périphérique et de la résolution

Il existe deux facteurs système qui déterminent la taille du texte et des graphiques sur votre résolution d'écran et PPP. La résolution décrit le nombre de pixels qui apparaissent à l'écran. Plus la résolution est élevée, plus les pixels sont petits, donnant l'impression de graphiques et de texte plus petits. Un graphique affiché sur un écran défini en 1024 x 768 apparaîtra beaucoup plus petit quand la résolution change en 1600 x 1200.

L'autre paramètre système, PPP, décrit la taille d'un pouce d'écran en pixels. La plupart des systèmes Windows ont un PPP de 96, ce qui signifie qu'un pouce d'écran fait 96 pixels. L'augmentation du paramètre PPP augmente le pouce d'écran et inversement. Cela signifie qu'un pouce d'écran n'a pas la même taille qu'un pouce réel sur la plupart des système. En augmentant le PPP, les graphiques et le texte reconnaissant PPP apparaissent plus grands car vous avez augmenté la taille du pouce d'écran. L'augmentation du PPP peut faciliter la lecture du texte, principalement dans les résolutions élevées.

Toutes les applications ne reconnaissent pas PPP : certaines utilisent les pixels matériels comme unité principale de mesure, la modification du PPP système n'a aucun effet sur ces applications. De nombreuses autres applications utilisent des unités reconnaissant PPP pour décrire les tailles de police, mais utilisent les pixels pour décrire tout le reste. Si le PPP est trop petit ou trop grand, cela peut entraîner des problèmes de disposition pour ces applications, car le texte des applications se met à l'échelle avec le paramètre PPP du système, mais pas l'interface utilisateur de l'application. Ce problème a été résolu pour les applications développées à l'aide de WPF.

WPF prend en charge la mise à l'échelle automatique en utilisant le pixel indépendant du périphérique comme unité principale de mesure, au lieu des pixels matériels ; les graphiques et le texte se mettent correctement à l'échelle sans travail supplémentaire de la part du développeur de l'application. L'illustration suivante montre un exemple d'affichage de texte et de graphiques WPF à différents paramètres PPP.

Graphiques et texte à différents paramètres PPP

Graphique et texte avec différents paramètres PPP

Classe VisualTreeHelper

La classe VisualTreeHelper est une classe d'aide statique qui fournit une fonction de bas niveau pour la programmation au niveau de l'objet visuel, ce qui peut s'avérer utile dans certains scénarios spécifiques, comme le développement de contrôles personnalisés haute performance. Dans la plupart des cas, les objets d'infrastructure WPF du niveau le plus élevé, tels que Canvas et TextBlock, offrent une plus grande flexibilité et facilité d'utilisation.

Test d'atteinte

La classe VisualTreeHelper fournit des méthodes de test d'atteinte sur objets visuels lorsque la prise en charge de test d'atteinte par défaut ne correspond pas à vos besoins. Vous pouvez utiliser les méthodes HitTest dans la classe VisualTreeHelper pour déterminer si une géométrie ou une valeur de point de coordonnée se trouve dans les limites d'un objet donné, tel qu'un contrôle ou élément graphique. Par exemple, vous pouvez utiliser le test d'atteinte pour déterminer si un clic de la souris dans le rectangle englobant d'un objet se situe dans la géométrie d'un cercle. Vous pouvez également choisir de remplacer l'implémentation par défaut du test d'atteinte pour effectuer vos propres calculs de test d'atteinte.

Pour plus d'informations sur les tests d'atteinte, consultez Test de positionnement dans la couche visuelle.

Énumération de l'arborescence d'éléments visuels

La classe VisualTreeHelper fournit une fonctionnalité pour énumérer les membres d'une arborescence d'éléments visuels. Pour récupérer un parent, appelez la méthode GetParent. Pour récupérer un enfant ou un descendant direct d'un objet visuel, appelez la méthode GetChild. Cette méthode retourne un Visual enfant du parent à l'index spécifié.

L'exemple suivant montre comment énumérer tous les descendants d'un objet visuel, une technique utile si vous voulez sérialiser toutes les informations de rendu d'une hiérarchie d'objets visuels.

        ' Enumerate all the descendants of the visual object.
        Public Shared Sub EnumVisual(ByVal myVisual As Visual)
            For i As Integer = 0 To VisualTreeHelper.GetChildrenCount(myVisual) - 1
                ' Retrieve child visual at specified index value.
                Dim childVisual As Visual = CType(VisualTreeHelper.GetChild(myVisual, i), Visual)

                ' Do processing of the child visual object.

                ' Enumerate children of the child visual object.
                EnumVisual(childVisual)
            Next i
        End Sub
// Enumerate all the descendants of the visual object.
static public void EnumVisual(Visual myVisual)
{
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(myVisual); i++)
    {
        // Retrieve child visual at specified index value.
        Visual childVisual = (Visual)VisualTreeHelper.GetChild(myVisual, i);

        // Do processing of the child visual object.

        // Enumerate children of the child visual object.
        EnumVisual(childVisual);
    }
}

Dans la plupart des cas, l'arborescence logique est une représentation des éléments plus utile dans une application WPF. Bien que vous ne modifiez pas directement l'arborescence logique, cette vue de l'application est pratique pour comprendre l'héritage de propriété et le routage d'événement. Contrairement à l'arborescence d'éléments visuels, l'arborescence logique peut représenter des objets de données non visuels, tels que ListItem. Pour plus d'informations sur l'arborescence logique, consultez Arborescences dans WPF.

La classe VisualTreeHelper fournit des méthodes permettant de retourner les rectangles englobants d'objets visuels. Vous pouvez retourner le rectangle englobant d'un objet visuel en appelant GetContentBounds. Vous pouvez retourner le rectangle englobant de tous les descendants d'un objet visuel, y compris l'objet visuel même, en appelant GetDescendantBounds. Le code suivant montre comment vous pourriez calculer le rectangle englobant d'un objet visuel et de tous ses descendants.

            ' Return the bounding rectangle of the parent visual object and all of its descendants.
            Dim rectBounds As Rect = VisualTreeHelper.GetDescendantBounds(parentVisual)
// Return the bounding rectangle of the parent visual object and all of its descendants.
Rect rectBounds = VisualTreeHelper.GetDescendantBounds(parentVisual);

Voir aussi

Référence

Visual

VisualTreeHelper

DrawingVisual

Concepts

Optimisation des performances : graphiques 2D et acquisition d'images

Test de positionnement dans la couche visuelle

Utilisation d'objets DrawingVisual

Didacticiel : hébergement d'objets visuels dans une application Win32

Optimisation des performances des applications WPF