Vue d'ensemble du concepteur WPF

Mise à jour : novembre 2007

Cette rubrique décrit le Concepteur Windows Presentation Foundation (WPF) pour Visual Studio. WPF est une technologie d'interface utilisateur conçue pour Windows Vista qui se distingue des technologies d'affichage antérieures, comme les Windows Forms.

Le Concepteur WPF fournit une prise en charge de la conception visuelle similaire au concepteur Windows Forms. Vous pouvez générer des interfaces utilisateur pour vos applications en faisant glisser des contrôles à partir de la boîte à outils et en définissant des propriétés dans la fenêtre Propriétés. En outre, vous pouvez directement modifier le code XAML dans l'éditeur XAML.

Fenêtres du Concepteur WPF

Le Concepteur WPF comporte plusieurs fenêtres permettant d'afficher et de modifier les documents XAML. L'illustration suivante présente certaines fenêtres disponibles dans le Concepteur WPF.

Mode Design

Le mode Design fournit une aire de conception visuelle permettant de générer vos contrôles et applications WPF. Il affiche une représentation restituée du code XAML actuellement en mode XAML.

Vous pouvez placer des contrôles sur l'aire de conception en les faisant glisser de la boîte à outils et vous pouvez positionner des contrôles en les faisant glisser. Plusieurs aides à la conception vous permettent de placer les contrôles avec une précision extrême. Lorsque vous modifiez des contrôles sur l'aire de conception, le mode XAML se met à jour pour refléter les modifications apportées. Pour plus d'informations, consultez Comment : ajouter des contrôles à une fenêtre WPF et Comment : sélectionner et déplacer des éléments sur l'aire de conception.

Mode XAML

Le mode XAML fournit une expérience de modification complète pour les documents XAML, notamment IntelliSense, la mise en forme automatique, la coloration syntaxique et la navigation de balises. Lorsque vous modifiez du code XAML, le mode Design se met à jour pour refléter les modifications apportées.

Pour plus d'informations, consultez Procédure pas à pas : édition de XAML dans le concepteur WPF.

Fenêtre Propriétés

La fenêtre Propriétés permet de définir des valeurs de propriété pour les contrôles en mode Design.

Pour accéder à la fenêtre Propriétés, ouvrez le menu Affichage et cliquez sur Fenêtre Propriétés, ou appuyez sur CTRL+W, P ou F4. Vous pouvez également cliquer avec le bouton droit sur un contrôle en mode Design, puis sélectionner Propriétés dans le menu contextuel. La fenêtre Propriétés affiche un aperçu miniature du contrôle actuellement sélectionné.

Pour rechercher une propriété, tapez le nom de la propriété dans la zone Rechercher située dans la partie supérieure de la fenêtre Propriétés. Les propriétés qui correspondent à votre recherche s'affichent au fur et à mesure de la saisie dans la fenêtre. Cliquez sur Effacer pour supprimer la recherche et afficher les propriétés de tous les objets sélectionnés.

À partir de Visual Studio 2008 Service Pack 1, il est possible de trier les propriétés par ordre alphabétique ou par catégorie. Pour trier les propriétés par ordre alphabétique, cliquez sur le bouton Alphabétique situé dans la partie supérieure de la fenêtre Propriétés. Pour les trier par catégorie, cliquez sur le bouton Par catégorie situé dans la partie supérieure de la fenêtre Propriétés.

Fenêtre Structure du document

La fenêtre Structure du document fournit une vue hiérarchique d'un document XAML. Vous pouvez utiliser la fenêtre Structure du document pour visualiser, sélectionner ou supprimer des éléments XAML. Pour accéder à la fenêtre Structure du document, ouvrez le menu Affichage, pointez sur Autres fenêtres, puis sélectionnez Structure du document, ou appuyez sur CTRL+ALT+T. Pour plus d'informations, consultez Navigation dans la hiérarchie des éléments d'un document WPF.

Boîte à outils

La boîte à outils contient les contrôles que vous pouvez faire glisser sur l'aire de conception. Pour accéder à la fenêtre Boîte à outils, ouvrez le menu Affichage et sélectionnez Boîte à outils, ou appuyez sur CTRL+ALT+X.

Fonctionnalités du mode Design

Le mode Design fournit de nombreuses fonctionnalités permettant de réorganiser les contrôles dans la fenêtre ou la page de votre application WPF. L'illustration suivante montre quelques fonctionnalités du mode Design.

Contrôle Zoom

Le contrôle Zoom permet de déterminer la taille de l'aire de conception. Vous pouvez effectuer un zoom de 10 % à 20x.

Ajuster à la fenêtre

Le bouton Ajuster à la fenêtre permet de dimensionner l'aire de conception en fonction de l'écran disponible en mode Design. Cette fonction s'avère utile si vous avez effectué un zoom avant ou arrière très puissant.

Rails de grille

Les rails de grille permettent de gérer les lignes et les colonnes d'un contrôle Grid. Vous pouvez créer et supprimer des colonnes et des lignes, ainsi qu'ajuster leurs largeurs et hauteurs relatives. Pour plus d'informations, consultez Comment : ajouter des lignes et des colonnes à une grille.

Quadrillage

Le quadrillage permet de déterminer la largeur et la hauteur des colonnes et des lignes pour Grid. Vous pouvez ajouter une nouvelle colonne ou ligne en cliquant sur les rails situés au-dessus et à gauche de Grid. Pour plus d'informations, consultez Comment : ajouter des lignes et des colonnes à une grille.

Indicateurs de quadrillage

Un indicateur de quadrillage s'affiche sous la forme d'un triangle sur le rail de grille. Lorsque vous faites glisser un indicateur de quadrillage ou le quadrillage lui-même, la largeur ou la hauteur des colonnes ou des lignes adjacentes se mettent à jour en fonction du déplacement de la souris. Pour plus d'informations, consultez Comment : ajouter des lignes et des colonnes à une grille.

Poignée de déplacement

Une poignée de déplacement s'affiche dans le coin supérieur gauche d'un contrôle Panel sélectionné. Cliquez sur la poignée de déplacement et faites glisser le contrôle vers la position souhaitée sur l'aire de conception. Pour plus d'informations, consultez Comment : sélectionner et déplacer des éléments sur l'aire de conception.

Poignées de redimensionnement

Les poignées de redimensionnement s'affichent sur les contrôles sélectionnés. Cliquez sur une poignée de redimensionnement et faites-la glisser pour modifier la taille de la sélection. Lorsque vous redimensionnez un contrôle, les valeurs de largeur et de hauteur s'affichent généralement pour permettre de déterminer la taille du contrôle avec précision.

Lignes de marge

Les marges représentent la quantité d'espace fixe entre le bord d'un contrôle et le bord du conteneur associé. Définissez les marges d'un contrôle en cliquant sur ses lignes de marge. Pour plus d'informations, consultez Comment : définir des marges pour un contrôle dans le concepteur WPF.

Stubs de marge

Un stub de marge s'affiche sur un contrôle sélectionné lorsque sa marge a la valeur 0. Cliquez sur le stub de marge pour définir une distance de marge sur le bord correspondant du conteneur. Pour plus d'informations, consultez Comment : définir des marges pour un contrôle dans le concepteur WPF.

Lignes d'alignement (SnapLines)

Les lignes d'alignement permettent d'aligner des contrôles les uns par rapport aux autres. Si les lignes d'alignement sont activées, lorsque vous faites glisser un contrôle par rapport à d'autres contrôles, les lignes d'alignement s'affichent lorsque le bord et le texte de contrôles sont alignés horizontalement ou verticalement. Pour plus d'informations, consultez Comment : aligner à la fois sur les lignes de base du texte et les marges.

Fonctionnalités du mode XAML

Le langage XAML (Extensible Application Markup Language) fournit un vocabulaire XML déclaratif permettant de spécifier l'interface utilisateur d'une application. Le Concepteur WPF propose un affichage fractionné unique, qui fournit un mode XAML et un mode Design synchronisé du balisage XAML restitué de votre application. L'illustration suivante affiche quelques fonctionnalités XAML disponibles.

Pour plus d'informations, consultez Affichage fractionné : afficher à la fois l'aire de conception WPF et XAML.

Barre de l'affichage fractionné

La barre de l'affichage fractionné permet de déterminer les tailles relatives des modes Design et XAML. Vous pouvez indiquer si l'affichage fractionné est horizontal ou vertical et vous pouvez réduire l'un des modes. Pour plus d'informations, consultez Affichage fractionné : afficher à la fois l'aire de conception WPF et XAML.

Navigateur des balises

Le navigateur des balises permet d'accéder à n'importe quelle balise parente de la balise sélectionnée en mode XAML. Lorsque vous pointez sur une balise dans le navigateur des balises, un aperçu miniature s'affiche pour cet élément. Procédure pas à pas : édition de XAML dans le concepteur WPF.

Génération d'interfaces utilisateur interactives et riches

Dans WPF, les classes Window et Page sont des surfaces visuelles sur lesquelles vous affichez des informations destinées à l'utilisateur. Habituellement, vous générez des applications WPF en ajoutant des contrôles à Window et en développant des réponses aux actions de l'utilisateur, comme des clics de souris ou des utilisations de touches. Un contrôle est un élément d'interface utilisateur discret qui affiche des données ou accepte une entrée de données.

Lorsqu'un utilisateur exécute une action sur Window ou l'un de ses contrôles, celle-ci génère un événement. Votre application réagit à ces événements et les traite lorsqu'ils se produisent. Pour plus d'informations, consultez Comment : créer un gestionnaire d'événements simple.

WPF contient divers contrôles que vous pouvez ajouter à une fenêtre : contrôles qui affichent des zones de texte, boutons, listes déroulantes, cases d'option et pages Web. Pour obtenir la liste de tous les contrôles que vous pouvez utiliser dans une fenêtre, consultez Bibliothèque de contrôles. Si un contrôle existant ne répond pas à vos besoins, WPF vous permet également de créer vos propres contrôles personnalisés à l'aide des classes UserControl et Control.

Grâce à la fonction de glisser-déplacer du Concepteur WPF, vous pouvez créer des applications WPF en toute simplicité. Il suffit de sélectionner les contrôles avec le pointeur et de les ajouter à l'emplacement souhaité dans la fenêtre. Le concepteur fournit des outils (lignes d'alignement et zoom continu, par exemple) qui simplifient la réorganisation des contrôles.

Enfin, si vous devez créer des éléments d'interface personnalisés, les espaces de noms System.Windows.Media et System.Windows.Shapes contiennent une large sélection de classes pour restituer des lignes, des cercles et d'autres formes directement dans une fenêtre.

Aide à la création de fenêtres et de contrôles

Pour des informations pas à pas sur l'utilisation de ces fonctionnalités, consultez les rubriques d'aide suivantes.

Collaboration avec Expression Blend

WPF fournit une séparation renforcée du contenu et de la présentation, qui permet aux développeurs de logiciels et aux concepteurs graphiques de collaborer sur l'apparence et le comportement d'une application. Le Concepteur Windows Presentation Foundation (WPF) pour Visual Studio est optimisé pour les développeurs de logiciels et Expression Blend est optimisé pour les concepteurs graphiques. Pour plus d'informations, consultez Collaboration avec Expression Blend.

Déploiement d'applications sur des ordinateurs clients

Après avoir écrit votre application, vous devez envoyer l'application à vos utilisateurs afin qu'ils puissent l'installer et l'exécuter sur leurs propres ordinateurs clients. Lorsque vous utilisez la technologie ClickOnce, vous pouvez déployer vos applications depuis Visual Studio, en quelques clics, et fournir à vos utilisateurs une URL vers votre application sur le Web ou sur un partage de fichiers. La technologie ClickOnce gère tous les éléments et dépendances dans votre application, et garantit que celle-ci est installée correctement sur l'ordinateur client.

Les applications ClickOnce peuvent être configurées pour s'exécuter uniquement lorsque l'utilisateur est connecté au réseau, ou pour s'exécuter en mode connexion et en mode hors connexion. Lorsque vous spécifiez qu'une application doit prendre en charge une opération hors connexion, ClickOnce ajoute un lien à votre application dans le menu Démarrer de l'utilisateur. L'utilisateur peut ensuite ouvrir l'application sans utiliser l'URL.

Lorsque vous mettez à jour votre application, vous publiez un nouveau manifeste de déploiement et une nouvelle copie de votre application sur votre serveur Web ou sur le partage de fichiers. La technologie ClickOnce détecte alors la disponibilité d'une mise à jour et met à niveau l'installation de l'utilisateur ; aucune programmation personnalisée n'est requise pour mettre à jour des assemblys anciens. Pour plus d'informations, consultez Déploiement d'applications WPF.

Déploiement d'applications ClickOnce

Pour une introduction complète à ClickOnce, consultez Vue d'ensemble du déploiement ClickOnce. Pour des informations pas à pas sur l'utilisation de ces fonctionnalités, consultez les rubriques d'aide suivantes :

Voir aussi

Concepts

Concepteur WPF pour les développeurs Windows Forms

Vue d'ensemble du déploiement ClickOnce

Vue d'ensemble des paramètres d'application

Collaboration avec Expression Blend

Autres ressources

Concepteur WPF

Bibliothèque de contrôles

XAML