Créer un contrôle de boîte à outils WPF

Le modèle de contrôle de boîte à outils WPF (Windows Presentation Framework) vous permet de créer des contrôles WPF qui sont automatiquement ajoutés à la boîte à outils lorsque l'extension est installée. Cette procédure-à-pas montre comment utiliser le modèle pour créer un contrôle boîte à outils que vous pouvez distribuer à d'autres utilisateurs.

Créer le contrôle Toolbox

Créer une extension avec un contrôle Toolbox WPF

  1. Créez un projet VSIX nommé MyToolboxControl. Vous pouvez trouver le modèle de projet VSIX dans la boîte de dialogue Nouveau projet en recherchant « vsix ».

  2. Lorsque le projet s'ouvre, ajoutez un modèle d'élément WPF Toolbox Control nommé MyToolboxControl. Dans l'Explorateur de solutions, cliquez avec le bouton droit de la souris sur le nœud du projet et sélectionnez Ajouter> un nouvel élément. Dans la boîte de dialogue Ajouter un nouvel élément, allez dans Visual C#>Extensibility et sélectionnez WPF Toolbox Control. Dans le champ Nom en bas de la fenêtre, changez le nom du fichier de commande en MyToolboxControl.cs.

    La solution contient maintenant un contrôle utilisateur, un ProvideToolboxControlAttribute RegistrationAttribute qui ajoute le contrôle à la boîte à outils, et une entrée Microsoft.VisualStudio.ToolboxControl Asset dans le manifeste VSIX pour le déploiement.

Pour créer l'interface utilisateur du contrôle

  1. Ouvrez MyToolboxControl.xaml dans le concepteur.

    Le concepteur affiche un contrôle Grid contenant un contrôle Button.

  2. Organisez la disposition de la grille. Lorsque vous sélectionnez le contrôle Grid, des barres de contrôle bleues apparaissent sur les bords supérieur et gauche de la grille. Vous pouvez ajouter des lignes et des colonnes à la grille en cliquant sur les barres.

  3. Ajoutez des contrôles enfants à la grille. Vous pouvez positionner un contrôle enfant en le faisant glisser de la boîte à outils vers une section de la grille ou en définissant ses attributs Grid.Row et Grid.Column dans le XAML. L'exemple suivant ajoute deux étiquettes sur la ligne supérieure de la grille et un bouton sur la deuxième ligne.

    <Grid>
        <Label Grid.Row="0" Grid.Column="0" Name="label1" />
        <Label Grid.Row="0" Grid.Column="1" Name="label2" />
        <Button Name="button1" Click="button1_Click" Grid.Row="1" Grid.ColumnSpan="2" />
    </Grid>
    

Renommer le contrôle

Par défaut, votre contrôle apparaîtra dans la boîte à outils sous le nom de MyToolboxControl dans un groupe nommé MyToolboxControl.MyToolboxControl. Vous pouvez modifier ces noms dans le fichier MyToolboxControl.xaml.cs.

  1. Ouvrez MyToolboxControl.xaml.cs dans la vue du code.

  2. Trouvez la classe MyToolboxControl et renommez-la en TestControl. (La méthode la plus rapide consiste à renommer la classe, puis à sélectionner Renommer dans le menu contextuel et à suivre les étapes. (Pour plus d'informations sur la commande Renommer, voir le refactoring Renommer (C#)).

  3. Accédez à l'attribut ProvideToolboxControl et modifiez la valeur du premier paramètre en Test. Il s'agit du nom du groupe qui contiendra le contrôle dans la boîte à outils.

    Le code résultant devrait ressembler à ceci :

    [ProvideToolboxControl("Test", true)]
    public partial class TestControl : UserControl
    {
        public TestControl()
        {
            InitializeComponent();
        }
    }
    

Construction, test et déploiement

Lorsque vous déboguez le projet, vous devriez trouver le contrôle installé dans la boîte à outils de l'instance expérimentale de Visual Studio.

Pour générer et tester le contrôle

  1. Reconstruisez le projet et commencez à le déboguer.

  2. Dans la nouvelle instance de Visual Studio, créez un projet d’application WPF. Assurez-vous que le concepteur XAML est ouvert.

  3. Recherchez votre contrôle dans la boîte à outils et faites-la glisser vers l’aire de conception.

  4. Commencez à déboguer l'application WPF.

  5. Vérifiez que votre contrôle apparaît.

Pour déployer le contenu

  1. Après avoir construit le projet testé, vous trouverez le fichier .vsix dans le dossier *bin\debug* du projet.

  2. Vous pouvez l'installer sur un ordinateur local en double-cliquant sur le fichier .vsix et en suivant la procédure d'installation. Pour désinstaller le contrôle, allez dans Outils>Extensions et mises à jour et recherchez l'extension du contrôle, puis cliquez sur Désinstaller.

  3. Chargez le fichier .vsix sur un réseau ou un site Web.

    Si vous chargez le fichier sur le site Web Visual Studio Marketplace, d'autres utilisateurs peuvent utiliser Tools>Extensions and Updates dans Visual Studio pour trouver le contrôle en ligne et l'installer.