Partager via


Procédure pas à pas : débogage des contrôles personnalisés WPF au moment du design

Mise à jour : novembre 2007

Cette procédure pas à pas indique comment déboguer un ornement au moment du design pour un contrôle personnalisé WPF (Windows Presentation Foundation). L'ornement est une case à cocher qui fournit une simple fonctionnalité de redimensionnement automatique.

Dans cette procédure pas à pas, vous exécutez les tâches suivantes :

  • créer un projet de bibliothèque de contrôles personnalisés WPF ;

  • créer un assembly distinct pour les métadonnées au moment du design ;

  • implémenter le fournisseur d'ornements ;

  • tester le contrôle au moment du design ;

  • configurer le projet pour le débogage au moment du design ;

  • déboguer le contrôle au moment du design.

Lorsque vous aurez terminé, vous saurez comment déboguer un ornement pour un contrôle personnalisé.

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.

Composants requis

Vous avez besoin des composants suivants pour accomplir cette procédure pas à pas :

  • Visual Studio 2008.

Création du contrôle personnalisé

La première étape consiste à créer le projet pour le contrôle personnalisé. Le contrôle est un bouton avec une petite portion de code au moment du design, qui utilise la méthode GetIsInDesignMode pour implémenter un comportement au moment du design.

Pour créer le contrôle personnalisé

  1. Créez un projet de bibliothèque de contrôles personnalisés WPF dans Visual Basic ou Visual C# nommé AutoSizeButtonLibrary.

    Le code pour CustomControl1 s'ouvre dans l'éditeur de code.

  2. Dans l'Explorateur de solutions, remplacez le nom du fichier de code par AutoSizeButton.cs ou AutoSizeButton.vb. Si un message s'affiche pour demander si vous souhaitez renommer toutes les références dans ce projet, cliquez sur Oui.

  3. Dans l'Explorateur de solutions, développez le dossier Thèmes.

  4. Double-cliquez sur Generic.xaml.

    Generic.xaml s'ouvre dans le Concepteur WPF.

  5. En mode XAML, remplacez toutes les occurrences de « CustomControl1 » par « AutoSizeButton ».

  6. Ouvrez AutoSizeButton.cs ou AutoSizeButton.vb dans l'éditeur de code.

  7. Remplacez le code généré automatiquement par le code suivant. Ce code hérite de Button et affiche le texte « Actif en mode Design » lorsque le bouton apparaît dans le concepteur.

    Imports System
    Imports System.Collections.Generic
    Imports System.Text
    Imports System.Windows.Controls
    Imports System.Windows.Media
    Imports System.ComponentModel
    
    ' The AutoSizeButton control implements a button
    ' with a custom design-time experience. 
    Public Class AutoSizeButton
        Inherits Button
    
        Public Sub New()
            ' The following code enables custom design-mode logic.
            ' The GetIsInDesignMode check and the following design-time 
            ' code are optional and shown only for demonstration.
            If DesignerProperties.GetIsInDesignMode(Me) Then
                Content = "Design mode active"
            End If
    
        End Sub
    End Class
    
    using System;
    using System.Collections.Generic;
    using System.Text;
    using System.Windows.Controls;
    using System.Windows.Media;
    using System.ComponentModel;
    
    namespace AutoSizeButtonLibrary
    {
        // The AutoSizeButton control implements a button
        // with a custom design-time experience. 
        public class AutoSizeButton : Button
        {
            public AutoSizeButton()
            {
                // The following code enables custom design-mode logic.
                // The GetIsInDesignMode check and the following design-time 
                // code are optional and shown only for demonstration.
                if (DesignerProperties.GetIsInDesignMode(this))
                {
                    Content = "Design mode active";
                }
            }
        }
    }
    
  8. Le chemin de sortie du projet doit être « bin\ ».

  9. Générez la solution.

Création de l'assembly de métadonnées au moment du design

Le code au moment du design est déployé dans des assemblys de métadonnées spéciaux. Pour cette procédure pas à pas, l'ornement personnalisé est déployé dans un assembly nommé AutoSizeButtonLibrary.VisualStudio.Design. Pour plus d'informations, consultez Magasin de métadonnées.

Pour créer l'assembly de métadonnées au moment du design

  1. Ajoutez à la solution un nouveau projet de bibliothèque de classes dans Visual Basic ou Visual C# nommé AutoSizeButtonLibrary.VisualStudio.Design.

  2. Le chemin de sortie du projet doit être « ..\AutoSizeButtonLibrary\bin\ ». Cela permet de garder l'assembly du contrôle et l'assembly de métadonnées dans le même dossier, ce qui active la découverte de métadonnées pour les concepteurs.

  3. Ajoutez des références aux assemblys WPF suivants.

    • PresentationCore

    • PresentationFramework

    • WindowsBase

  4. Ajoutez des références aux assemblys du Concepteur WPF suivants.

    • Microsoft.Windows.Design

    • Microsoft.Windows.Design.Extensibility

    • Microsoft.Windows.Design.Interaction

  5. Ajoutez une référence au projet AutoSizeButtonLibrary.

  6. Dans l'Explorateur de solutions, remplacez le nom du fichier de code Class1 par Metadata.cs ou Metadata.vb. Si un message s'affiche pour demander si vous souhaitez renommer toutes les références dans ce projet, cliquez sur Oui.

  7. Remplacez le code généré automatiquement par le code suivant. Ce code crée un AttributeTable qui attache l'implémentation au moment du design personnalisée à la classe AutoSizeButton.

    Imports System
    Imports System.Collections.Generic
    Imports System.Text
    Imports System.ComponentModel
    Imports System.Windows.Media
    Imports System.Windows.Controls
    Imports System.Windows
    
    Imports AutoSizeButtonLibrary
    Imports Microsoft.Windows.Design.Features
    Imports Microsoft.Windows.Design.Metadata
    Imports AutoSizeButtonLibrary.VisualStudio.Design
    
    ' Container for any general design-time metadata to initialize.
    ' Designers look for a type in the design-time assembly that 
    ' implements IRegisterMetadata. If found, designers instantiate 
    ' this class and call its Register() method automatically.
    Friend Class Metadata
        Implements IRegisterMetadata
    
        ' Called by the designer to register any design-time metadata.
        Public Sub Register() Implements IRegisterMetadata.Register
            Dim builder As New AttributeTableBuilder()
    
            builder.AddCustomAttributes(GetType(AutoSizeButton), New FeatureAttribute(GetType(AutoSizeAdornerProvider)))
    
            MetadataStore.AddAttributeTable(builder.CreateTable())
    
        End Sub
    End Class
    
    using System;
    using System.Collections.Generic;
    using System.Text;
    using System.ComponentModel;
    using System.Windows.Media;
    using System.Windows.Controls;
    using System.Windows;
    
    using AutoSizeButtonLibrary;
    using Microsoft.Windows.Design.Features;
    using Microsoft.Windows.Design.Metadata;
    using AutoSizeButtonLibrary.VisualStudio.Design;
    
    namespace AutoSizeButtonLibrary.VisualStudio.Design
    {
        // Container for any general design-time metadata to initialize.
        // Designers look for a type in the design-time assembly that 
        // implements IRegisterMetadata. If found, designers instantiate 
        // this class and call its Register() method automatically.
        internal class Metadata : IRegisterMetadata
        {
            // Called by the designer to register any design-time metadata.
            public void Register()
            {
                AttributeTableBuilder builder = new AttributeTableBuilder();
    
                builder.AddCustomAttributes(
                    typeof(AutoSizeButton),
                    new FeatureAttribute(typeof(AutoSizeAdornerProvider)));
    
                MetadataStore.AddAttributeTable(builder.CreateTable());
            }
        }
    }
    
  8. Enregistrez la solution.

Implémentation du fournisseur d'ornements

Le fournisseur d'ornements est implémenté dans un type nommé AutoSizeAdornerProvider. Cet ornement FeatureProvider permet de définir les propriétés Height et Width du contrôle au moment du design.

Pour implémenter le fournisseur d'ornements

  1. Ajoutez une nouvelle classe nommée AutoSizeAdornerProvider au projet AutoSizeButtonLibrary.VisualStudio.Design.

  2. Dans l'éditeur de code pour AutoSizeAdornerProvider, remplacez le code généré automatiquement par le code suivant. Ce code implémente un PrimarySelectionAdornerProvider qui fournit un ornement basé sur un contrôle CheckBox.

    Imports System
    Imports System.Collections.Generic
    Imports System.Text
    Imports System.Windows.Input
    Imports System.Windows
    Imports System.Windows.Automation
    Imports System.Windows.Controls
    Imports System.Windows.Media
    Imports System.Windows.Shapes
    Imports Microsoft.Windows.Design.Interaction
    Imports Microsoft.Windows.Design.Model
    
    
    ' The following class implements an adorner provider for the 
    ' AutoSizeButton control. The adorner is a CheckBox control, which 
    ' changes the Height and Width of the AutoSizeButton to "Auto",
    ' which is represented by double.NaN.
    Public Class AutoSizeAdornerProvider
        Inherits PrimarySelectionAdornerProvider
    
        Private settingProperties As Boolean
        Private adornedControlModel As ModelItem
        Private autoSizeCheckBox As CheckBox
        Private autoSizeAdornerPanel As AdornerPanel
    
        ' The constructor sets up the adorner control. 
        Public Sub New()
            autoSizeCheckBox = New CheckBox()
            autoSizeCheckBox.Content = "AutoSize"
            autoSizeCheckBox.IsChecked = True
            autoSizeCheckBox.FontFamily = AdornerFonts.FontFamily
            autoSizeCheckBox.FontSize = AdornerFonts.FontSize
            autoSizeCheckBox.Background = CType( _
                AdornerResources.FindResource(AdornerColors.RailFillBrushKey),  _
                Brush)
        End Sub
    
        ' The following method is called when the adorner is activated.
        ' It creates the adorner control, sets up the adorner panel,
        ' and attaches a ModelItem to the AutoSizeButton.
        Protected Overrides Sub Activate(ByVal item As ModelItem, ByVal view As DependencyObject)
    
            ' Save the ModelItem and hook into when it changes.
            ' This enables updating the slider position when 
            ' a new background value is set.
            adornedControlModel = item
            AddHandler adornedControlModel.PropertyChanged, AddressOf AdornedControlModel_PropertyChanged
    
            ' All adorners are placed in an AdornerPanel
            ' for sizing and layout support.
            Dim panel As AdornerPanel = Me.Panel
    
            ' Set up the adorner's placement.
            Dim placement As New AdornerPlacementCollection()
            AdornerPanel.SetHorizontalStretch(autoSizeCheckBox, AdornerStretch.None)
            AdornerPanel.SetVerticalStretch(autoSizeCheckBox, AdornerStretch.None)
    
            panel.CoordinateSpace = AdornerCoordinateSpaces.Layout
    
            placement.SizeRelativeToAdornerDesiredWidth(1.0, 0)
            placement.SizeRelativeToAdornerDesiredHeight(1.0, 0)
            placement.PositionRelativeToAdornerHeight(-1.0, -23)
            placement.PositionRelativeToAdornerWidth(0, -23)
    
            AdornerPanel.SetPlacements(autoSizeCheckBox, placement)
    
            ' Listen for changes to the checked state.
            AddHandler autoSizeCheckBox.Checked, AddressOf autoSizeCheckBox_Checked
            AddHandler autoSizeCheckBox.Unchecked, AddressOf autoSizeCheckBox_Unchecked
    
            ' Run the base implementation.
            MyBase.Activate(item, view)
    
        End Sub
    
        ' The Panel utility property demand-creates the 
        ' adorner panel and adds it to the provider's 
        ' Adorners collection.
        Public ReadOnly Property Panel() As AdornerPanel
            Get
                If Me.autoSizeAdornerPanel Is Nothing Then
                    Me.autoSizeAdornerPanel = New AdornerPanel()
    
                    ' Add the adorner to the adorner panel.
                    Me.autoSizeAdornerPanel.Children.Add(autoSizeCheckBox)
    
                    ' Add the panel to the Adorners collection.
                    Adorners.Add(autoSizeAdornerPanel)
    
                End If
    
                Return Me.autoSizeAdornerPanel
            End Get
        End Property
    
        ' The following code handles the Checked event.
        ' It autosizes the adorned control's Height and Width.
        Sub autoSizeCheckBox_Checked(ByVal sender As Object, ByVal e As RoutedEventArgs) 
            Me.SetHeightAndWidth(True)
        End Sub
    
    
        ' The following code handles the Unchecked event.
        ' It sets the adorned control's Height and Width to a hard-coded value.
        Sub autoSizeCheckBox_Unchecked(ByVal sender As Object, ByVal e As RoutedEventArgs) 
            Me.SetHeightAndWidth(False)
        End Sub
    
        ' The SetHeightAndWidth utility method sets the Height and Width
        ' properties through the model and commits the change.
        Private Sub SetHeightAndWidth(ByVal [auto] As Boolean) 
    
            settingProperties = True
    
            Dim batchedChange As ModelEditingScope = adornedControlModel.BeginEdit()
            Try
                Dim widthProperty As ModelProperty = adornedControlModel.Properties(Control.WidthProperty)
    
                Dim heightProperty As ModelProperty = adornedControlModel.Properties(Control.HeightProperty)
    
                If [auto] Then
                    widthProperty.ClearValue()
                    heightProperty.ClearValue()
                Else
                    widthProperty.SetValue(20.0)
                    heightProperty.SetValue(20.0)
                End If
    
                batchedChange.Complete()
            Finally
                batchedChange.Dispose()
                settingProperties = False
            End Try
    
        End Sub
    
        ' The following method deactivates the adorner.
        Protected Overrides Sub Deactivate()
    
            RemoveHandler adornedControlModel.PropertyChanged, _
                AddressOf AdornedControlModel_PropertyChanged
    
            MyBase.Deactivate()
    
        End Sub
    
    
        ' The following method handles the PropertyChanged event.
        Sub AdornedControlModel_PropertyChanged( _
            ByVal sender As Object, _
            ByVal e As System.ComponentModel.PropertyChangedEventArgs)
    
            If settingProperties Then Return
    
            If e.PropertyName = "Height" Or e.PropertyName = "Width" Then
                Dim h As Double = CType(adornedControlModel.Properties(Control.HeightProperty).ComputedValue, Double)
                Dim w As Double = CType(adornedControlModel.Properties(Control.WidthProperty).ComputedValue, Double)
    
                If Double.IsNaN(h) And Double.IsNaN(w) Then
                    autoSizeCheckBox.IsChecked = True
                Else
                    autoSizeCheckBox.IsChecked = False
                End If
            End If
    
        End Sub
    End Class
    
    using System;
    using System.Collections.Generic;
    using System.Text;
    using System.Windows.Input;
    using System.Windows;
    using System.Windows.Automation;
    using System.Windows.Controls;
    using System.Windows.Media;
    using System.Windows.Shapes;
    using Microsoft.Windows.Design.Interaction;
    using Microsoft.Windows.Design.Model;
    
    namespace AutoSizeButtonLibrary.VisualStudio.Design
    {
        // The following class implements an adorner provider for the 
        // AutoSizeButton control. The adorner is a CheckBox control, which 
        // changes the Height and Width of the AutoSizeButton to "Auto",
        // which is represented by double.NaN.
        public class AutoSizeAdornerProvider : PrimarySelectionAdornerProvider
        {
            bool settingProperties;
            private ModelItem adornedControlModel;
            CheckBox autoSizeCheckBox;
            AdornerPanel autoSizeAdornerPanel;
    
            // The constructor sets up the adorner control. 
            public AutoSizeAdornerProvider()
            {
                autoSizeCheckBox = new CheckBox();
                autoSizeCheckBox.Content = "AutoSize";
                autoSizeCheckBox.IsChecked = true;
                autoSizeCheckBox.FontFamily = AdornerFonts.FontFamily;
                autoSizeCheckBox.FontSize = AdornerFonts.FontSize;
                autoSizeCheckBox.Background = AdornerResources.FindResource(
                    AdornerColors.RailFillBrushKey) as Brush;
            }
    
            // The following method is called when the adorner is activated.
            // It creates the adorner control, sets up the adorner panel,
            // and attaches a ModelItem to the AutoSizeButton.
            protected override void Activate(ModelItem item, DependencyObject view)
            {
                // Save the ModelItem and hook into when it changes.
                // This enables updating the slider position when 
                // a new background value is set.
                adornedControlModel = item;
                adornedControlModel.PropertyChanged += 
                    new System.ComponentModel.PropertyChangedEventHandler(
                        AdornedControlModel_PropertyChanged);
    
                // All adorners are placed in an AdornerPanel
                // for sizing and layout support.
                AdornerPanel panel = this.Panel;
    
                // Set up the adorner's placement.
                AdornerPlacementCollection placement = new AdornerPlacementCollection();
                AdornerPanel.SetHorizontalStretch(autoSizeCheckBox, AdornerStretch.None);
                AdornerPanel.SetVerticalStretch(autoSizeCheckBox, AdornerStretch.None);
    
                panel.CoordinateSpace = AdornerCoordinateSpaces.Layout;
    
                placement.SizeRelativeToAdornerDesiredWidth(1.0, 0);
                placement.SizeRelativeToAdornerDesiredHeight(1.0, 0);
                placement.PositionRelativeToAdornerHeight(-1.0, -23);
                placement.PositionRelativeToAdornerWidth(0, -23);
    
                AdornerPanel.SetPlacements(autoSizeCheckBox, placement);
    
                // Listen for changes to the checked state.
                autoSizeCheckBox.Checked += new RoutedEventHandler(autoSizeCheckBox_Checked);
                autoSizeCheckBox.Unchecked += new RoutedEventHandler(autoSizeCheckBox_Unchecked);
    
                // Run the base implementation.
                base.Activate(item, view);
            }
    
            // The Panel utility property demand-creates the 
            // adorner panel and adds it to the provider's 
            // Adorners collection.
            private AdornerPanel Panel
            {
                get
                {
                    if (this.autoSizeAdornerPanel == null)
                    {
                        autoSizeAdornerPanel = new AdornerPanel();
    
                        // Add the adorner to the adorner panel.
                        autoSizeAdornerPanel.Children.Add(autoSizeCheckBox);
    
                        // Add the panel to the Adorners collection.
                        Adorners.Add(autoSizeAdornerPanel);
                    }
    
                    return this.autoSizeAdornerPanel;
                }
            }
    
            // The following code handles the Checked event.
            // It autosizes the adorned control's Height and Width.
            void autoSizeCheckBox_Checked(object sender, RoutedEventArgs e)
            {
                this.SetHeightAndWidth(true);
            }
    
            // The following code handles the Unchecked event.
            // It sets the adorned control's Height and Width to a hard-coded value.
            void autoSizeCheckBox_Unchecked(object sender, RoutedEventArgs e)
            {
                this.SetHeightAndWidth(false);
            }
    
            // The SetHeightAndWidth utility method sets the Height and Width
            // properties through the model and commits the change.
            private void SetHeightAndWidth(bool autoSize)
            {
                settingProperties = true;
    
                try
                {
                using (ModelEditingScope batchedChange = adornedControlModel.BeginEdit())
                {
                    ModelProperty widthProperty =
                        adornedControlModel.Properties[Control.WidthProperty];
    
                    ModelProperty heightProperty =
                        adornedControlModel.Properties[Control.HeightProperty];
    
                    if (autoSize)
                    {
                        widthProperty.ClearValue();
                        heightProperty.ClearValue();
                    }
                    else
                    {
                        widthProperty.SetValue(20d);
                        heightProperty.SetValue(20d);
                    }
    
                    batchedChange.Complete();
                }
                }
                finally { settingProperties = false; }
            }
    
            // The following method deactivates the adorner.
            protected override void Deactivate()
            {
                adornedControlModel.PropertyChanged -= 
                    new System.ComponentModel.PropertyChangedEventHandler(
                        AdornedControlModel_PropertyChanged);
    
                base.Deactivate();
            }
    
            // The following method handles the PropertyChanged event.
            void AdornedControlModel_PropertyChanged(
                object sender, 
                System.ComponentModel.PropertyChangedEventArgs e)
            {
                if (settingProperties)
                {
                    return;
                }
    
                if (e.PropertyName == "Height" || e.PropertyName == "Width")
                {
                    double h = (double)adornedControlModel.Properties[Control.HeightProperty].ComputedValue;
                    double w = (double)adornedControlModel.Properties[Control.WidthProperty].ComputedValue;
    
                    autoSizeCheckBox.IsChecked = (h == double.NaN && w == double.NaN) ? true : false;
                }
            }
        }
    }
    
  3. Générez la solution.

Test de l'implémentation au moment du design

Vous pouvez utiliser le contrôle AutoSizeButton comme vous utiliseriez tout autre contrôle WPF. Le Concepteur WPF gère la création de tous les objets au moment du design.

Pour tester l'implémentation au moment du design

  1. Ajoutez à la solution un nouveau projet d'application WPF nommé DemoApplication.

    Window1.xaml s'ouvre dans le Concepteur WPF.

  2. Ajoutez une référence au projet AutoSizeButtonLibrary.

  3. En mode XAML, remplacez le code généré automatiquement par le code suivant. Ce code XAML ajoute une référence à l'espace de noms AutoSizeButtonLibrary ainsi que le contrôle personnalisé AutoSizeButton. Le bouton apparaît en mode Design avec le texte « Actif en mode Design », indiquant que ce mode est activé. Si le bouton ne s'affiche pas, il peut s'avérer nécessaire de cliquer sur la barre d'informations, située dans la partie supérieure du concepteur, pour recharger la vue.

    <Window x:Class="DemoApplication.Window1"
        xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ab="clr-namespace:AutoSizeButtonLibrary;assembly=AutoSizeButtonLibrary"
        Title="Window1" Height="300" Width="300">
        <Grid>
            <ab:AutoSizeButton />
        </Grid>
    </Window>
    
    <Window x:Class="DemoApplication.Window1"
        xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ab="clr-namespace:AutoSizeButtonLibrary;assembly=AutoSizeButtonLibrary"
        Title="Window1" Height="300" Width="300">
        <Grid>
            <ab:AutoSizeButton Height="Auto" Width="Auto" />
        </Grid>
    </Window>
    
  4. En mode Design, cliquez sur le contrôle AutoSizeButton pour le sélectionner.

    Un contrôle CheckBox apparaît au-dessus du contrôle AutoSizeButton.

  5. Désactivez l'ornement case à cocher.

    La taille du contrôle diminue. L'ornement case à cocher se déplace pour conserver sa position par rapport au contrôle orné.

Configuration du projet pour le débogage au moment du design

À ce stade, vous avez terminé l'implémentation au moment du design. Vous pouvez à présent utiliser Visual Studio pour définir des points d'arrêt et effectuer un pas à pas détaillé dans votre code au moment du design. Pour déboguer votre implémentation au moment du design, vous attachez une autre instance de Visual Studio à la session Visual Studio active.

Pour configurer le projet pour le débogage au moment du design

  1. Dans l'Explorateur de solutions, cliquez avec le bouton droit sur le projet DemoApplication, puis sélectionnez Définir comme projet de démarrage.

  2. Dans l'Explorateur de solutions, cliquez avec le bouton droit sur le projet DemoApplication, puis cliquez sur Propriétés.

  3. Dans le Concepteur de projets DemoApplication, cliquez sur l'onglet Déboguer.

  4. Dans la section Action de démarrage, sélectionnez Démarrer le programme externe. Vous allez déboguer une instance distincte de Visual Studio.

  5. Cliquez sur le bouton de sélection (Capture d'écran VisualStudioEllipsesButton) pour ouvrir la boîte de dialogue Sélectionner le fichier.

  6. Recherchez Visual Studio. Le nom du fichier exécutable est devenv.exe et, si vous avez installé Visual Studio à l'emplacement par défaut, son chemin d'accès est « %programfiles%\Microsoft Visual Studio 9.0\Common7\IDE\devenv.exe ».

  7. Cliquez sur Ouvrir pour sélectionner devenv.exe.

Débogage de votre contrôle personnalisé au moment du design

Maintenant vous êtes prêt à déboguer votre contrôle personnalisé pendant il s'exécute en mode Design. Lorsque vous démarrez la session de débogage, une nouvelle instance de Visual Studio est créée et vous devez l'utiliser pour charger la solution AutoSizeButtonLibrary. Lorsque vous ouvrez Window1.xaml dans le Concepteur WPF, une instance de votre contrôle personnalisé est créée et commence à s'exécuter.

Pour déboguer votre contrôle personnalisé au moment du design

  1. Ouvrez le fichier de code AutoSizeButton dans l'éditeur de code et ajoutez un point d'arrêt dans le constructeur.

  2. Ouvrez Metadata.cs ou Metadata.vb dans l'éditeur de code et ajoutez un point d'arrêt dans la méthode Register.

  3. Ouvrez AutoSizeAdornerProvider.cs ou AutoSizeAdornerProvider.vb dans l'éditeur de code et ajoutez un point d'arrêt dans le constructeur.

  4. Ajoutez des points d'arrêt dans les autres méthodes de la classe AutoSizeAdornerProvider.

  5. Appuyez sur F5 pour démarrer la session de débogage.

    Une seconde instance de Visual Studio est créée. Vous pouvez effectuer la distinction entre l'instance de débogage et la seconde instance de deux manières différentes :

    • La barre de titre de l'instance de débogage contient le mot En cours d'exécution.

    • Pour l'instance de débogage, le bouton Démarrer est désactivé sur sa barre d'outils Déboguer.

    Votre point d'arrêt est défini dans l'instance de débogage.

  6. Dans la seconde instance de Visual Studio, ouvrez la solution AutoSizeButtonLibrary.

  7. Ouvrez Window1.xaml dans le Concepteur WPF.

    L'instance de débogage de Visual Studio obtient le focus et l'exécution s'arrête au point d'arrêt dans Register.

  8. Appuyez sur F5 pour continuer le débogage.

    L'exécution s'arrête au point d'arrêt dans le constructeur AutoSizeButton.

  9. Appuyez sur F5 pour continuer le débogage.

    La seconde instance de Visual Studio obtient le focus et le Concepteur WPF s'affiche.

  10. En mode Design, cliquez sur le contrôle AutoSizeButton pour le sélectionner.

    L'instance de débogage de Visual Studio obtient le focus et l'exécution s'arrête au point d'arrêt dans le constructeur AutoSizeAdornerProvider.

  11. Appuyez sur F5 pour continuer le débogage.

    L'exécution s'arrête au point d'arrêt dans la méthode Activate.

  12. Appuyez sur F5 pour continuer le débogage.

    La seconde instance de Visual Studio obtient le focus et le Concepteur WPF s'affiche. L'ornement case à cocher s'affiche au-dessus et à gauche de AutoSizeButton.

  13. Lorsque vous avez terminé, vous pouvez arrêter la session de débogage en fermant la seconde instance de Visual Studio ou en cliquant sur le bouton Arrêter le débogage dans l'instance de débogage.

Étapes suivantes

Vous pouvez ajouter d'autres fonctionnalités personnalisées au moment du design à vos contrôles personnalisés.

Voir aussi

Référence

PrimarySelectionAdornerProvider

SkewTransform

Autres ressources

Concepts d'extensibilité avancés

Extensibilité du concepteur WPF