Partager via


Organiser les objets en conteneurs de disposition dans le concepteur XAML

Cet article décrit les panneaux de disposition et les contrôles du concepteur XAML.

Réfléchissez à l'endroit où vous souhaitez faire figurer les objets dans une page (des objets tels que des images, des boutons et des vidéos). Peut-être souhaiterez-vous qu'ils apparaissent dans des lignes et des colonnes, dans une seule ligne verticale ou horizontale ou bien à des emplacements fixes ?

Une fois que vous avez déterminé l’aspect que vous voulez donner à la page, choisissez un panneau de disposition. Il s’agit de la structure de base de toutes les pages à laquelle vous allez ajouter vos objets. Par défaut, il s’agit d’une grille, mais vous pouvez changer cela.

Si les panneaux de disposition permettent de disposer les objets dans une page, leur fonction ne s'arrête pas là. Ils vous permettent de concevoir pour différentes tailles et résolutions d'écran. Quand les utilisateurs exécutent votre application, tout ce qui figure dans le panneau de disposition est redimensionné pour s'adapter à la taille d'écran de leur appareil. Bien entendu, vous pouvez éviter cela en changeant tout ou partie du comportement de la disposition. Pour ce faire, vous pouvez utiliser les propriétés de hauteur et de largeur.

Panneaux de disposition

Commencez votre page en choisissant l'un de ces panneaux de disposition. Votre page peut en contenir plusieurs. Par exemple, vous pouvez commencer par un panneau de disposition Grid et ajouter à une zone de ce dernier un StackPanel pour disposer les contrôles à la verticale dans cet élément Grid.

Les panneaux de disposition suivants sont les plus couramment utilisés, mais il en existe d'autres. Vous les trouverez toutes dans la Boîte à outils de Visual Studio ou dans le panneau Composants de Blend pour Visual Studio.

Grille

Permet de disposer les objets dans des lignes et des colonnes.

Panneau de disposition de la grille

UniformGrid

Permet de disposer les objets dans des régions de grille égales ou uniformes. Ce panneau est très pratique pour organiser une liste d'images.

(Disponible seulement pour les projets WPF)

Panneau de disposition UniformGrid

Canevas

Permet de disposer les objets librement. Quand les utilisateurs exécutent votre application, ces éléments ont des positions fixes sur l'écran.

Panneau de disposition de la zone de dessin

StackPanel

Permet de disposer les objets dans une seule ligne horizontale ou verticale.

Panneau de disposition StackPanel

WrapPanel

Permet de disposer les objets les uns à la suite des autres, de gauche à droite. Quand il n’y a plus de place à l’extrémité droite du panneau, il renvoie le contenu à la ligne suivante, et ainsi de suite de gauche à droite et de haut en bas. Vous pouvez aussi disposer un panneau de renvoi à la ligne à la verticale de sorte que les objets se suivent de haut en bas et de gauche à droite.

(Disponible seulement pour les projets WPF)

Panneau de disposition WrapPanel

DockPanel

Permet de disposer les objets de telle sorte qu’il restent, ou s’ancrent, sur un bord du panneau.

(Disponible seulement pour les projets WPF)

Panneau de disposition DockPanel

Regarder une courte vidéo : Bouton Lecture WPF - DockPanel

Contrôles de disposition

Vous pouvez aussi ajouter vos objets à des contrôles de disposition. Ils n’offrent pas autant de fonctionnalités qu’un panneau de disposition, mais ils peuvent s’avérer utiles pour certains scénarios.

Les contrôles de disposition suivants sont les plus couramment utilisés, mais il en existe d’autres. Vous les trouverez toutes dans la Boîte à outils de Visual Studio ou dans le panneau Composants de Blend pour Visual Studio.

Bordure

Permet de créer une bordure, un arrière-plan ou les deux autour d'un objet. Vous ne pouvez ajouter qu’un seul objet à un Border. Si vous voulez appliquer une bordure ou un arrière-plan à plusieurs objets, ajoutez un panneau de disposition au Border. Ajoutez ensuite les objets à ce panneau ou contrôle.

Contrôle de disposition de bordure

Permet d'afficher des informations ou des options à l'intention des utilisateurs dans une fenêtre. Vous ne pouvez ajouter qu’un seul objet à un Popup. Par défaut, un Popup contient un Grid. Toutefois, d’autres options sont disponibles.

ScrollViewer

Permet aux utilisateurs de faire défiler une page ou l’une de ses zones vers le bas. Sachant que vous ne pouvez ajouter qu’un seul objet à un ScrollViewer, il est judicieux d’ajouter un panneau de disposition tel qu’un Grid ou un StackPanel.

Contrôle de disposition ScrollViewer

Viewbox

Met à l'échelle les objets à la façon d'un contrôle de zoom. Vous ne pouvez ajouter qu’un seul objet à un Viewbox. Si vous voulez appliquer cet effet à plusieurs objets, ajoutez un panneau de disposition au ViewBox, puis ajoutez vos contrôles à ce panneau.

Contrôle de disposition ViewBox