Comment : créer une interface utilisateur à plusieurs volets avec des Windows Forms à l'aide du concepteur

Mise à jour : novembre 2007

Dans la procédure suivante, vous créerez une interface utilisateur à plusieurs volets qui est semblable à celle qui est utilisée dans Microsoft Outlook, avec une liste Dossier, un volet Messages et un volet Aperçu. Cette disposition est obtenue principalement en ancrant des contrôles sur le formulaire.

Lorsque vous ancrez un contrôle, vous déterminez le bord du conteneur parent auquel un contrôle est attaché. Par conséquent, si vous affectez à la propriété Dock la valeur Right, le bord droit du contrôle sera ancré au bord droit de son contrôle parent. En outre, le bord ancré du contrôle est redimensionné pour correspondre à celui de son contrôle conteneur. Pour plus d'informations sur le fonctionnement de la propriété Dock, consultez Comment : ancrer des contrôles aux Windows Forms.

Cette procédure se concentre sur la disposition du contrôle SplitContainer et des autres contrôles sur le formulaire, et non sur l'ajout de fonctionnalités pour que l'application ressemble à Microsoft Outlook.

Pour créer cette interface utilisateur, vous placez tous les contrôles dans un contrôle SplitContainer qui contient un contrôle TreeView dans le panneau gauche. Le panneau droit du contrôle SplitContainer contient un deuxième contrôle SplitContainer avec un contrôle ListView au-dessus d'un contrôle RichTextBox. Ces contrôles SplitContainer permettent un redimensionnement indépendant des autres contrôles sur le formulaire. Les techniques présentées dans cette procédure vous aideront à créer vos propres interfaces utilisateur personnalisées.

Remarque :

Les boîtes de dialogue et les commandes de menu qui s'affichent peuvent être différentes de celles qui sont décrites dans l'aide, en fonction de vos paramètres actifs ou de l'édition utilisée. Pour modifier vos paramètres, choisissez Importation et exportation de paramètres dans le menu Outils. Pour plus d'informations, consultez Paramètres Visual Studio.

Pour créer une interface utilisateur du style Outlook au moment du design

  1. Créez un projet d'application Windows. Pour plus d'informations, consultez Comment : créer un projet d'application Windows.

  2. Faites glisser un contrôle SplitContainer de la Boîte à outils jusqu'au formulaire. Dans la fenêtre Propriétés, affectez à la propriété Dock la valeur Fill.

  3. Faites glisser un contrôle TreeView de la Boîte à outils vers le panneau gauche du contrôle SplitContainer. Dans la fenêtre Propriétés, affectez la valeur Left à la propriété Dock en cliquant sur le panneau gauche de l'éditeur de valeurs qui s'affiche lorsque vous cliquez sur la flèche vers le bas.

  4. Faites glisser un autre contrôle SplitContainer de la Boîte à outils ; placez-le dans le panneau droit du contrôle SplitContainer que vous avez ajouté à votre formulaire. Dans la fenêtre Propriétés, affectez à la propriété Dock la valeur Fill et à la propriété Orientation la valeur Horizontal.

  5. Faites glisser un contrôle ListView de la Boîte à outils vers le panneau supérieur du deuxième contrôle SplitContainer que vous avez ajouté à votre formulaire. Affectez à la propriété Dock du contrôle ListView la valeur Fill.

  6. Faites glisser un contrôle RichTextBox de la Boîte à outils vers le panneau inférieur du deuxième contrôle SplitContainer. Affectez à la propriété Dock du contrôle RichTextBox la valeur Fill.

    À ce stade, si vous appuyez sur F5 pour exécuter l'application, le formulaire affiche une interface utilisateur en trois parties, semblable à celle de Microsoft Outlook.

    Remarque :

    Lorsque vous placez le pointeur de souris sur l'un des séparateurs dans les contrôles SplitContainer, vous pouvez modifier les dimensions internes.

    À ce stade du développement de l'application, vous avez créé une interface utilisateur sophistiquée. L'étape suivante consiste à continuer la programmation de l'application elle-même, peut-être en connectant le contrôle TreeView et les contrôles ListView à une source de données. Pour plus d'informations sur la connexion de contrôles aux données, consultez Liaison de données et Windows Forms.

Voir aussi

Tâches

Contrôle SplitContainer, exemple

Référence

SplitContainer

Autres ressources

SplitContainer, contrôle (Windows Forms)