Compartir a través de


Tutorial: Depurar controles personalizados de WPF en tiempo de diseño

Actualización: noviembre 2007

En este tutorial se muestra cómo depurar un adorno en tiempo de diseño para un control personalizado de Windows Presentation Foundation (WPF). El adorno es una casilla, que proporciona una característica sencilla de ajuste tamaño automático.

En este tutorial realizará las siguientes tareas:

  • Crear un proyecto de biblioteca de controles personalizados de WPF.

  • Crear un ensamblado independiente para los metadatos de tiempo de diseño.

  • Implementar el proveedor de adornos.

  • Probar el control en tiempo de diseño.

  • Configurar el proyecto para la depuración en tiempo de diseño.

  • Depurar el control en tiempo de diseño.

Cuando haya finalizado, sabrá depurar un adorno para un control personalizado.

Nota:

Los cuadros de diálogo y los comandos de menú que se ven pueden diferenciarse de los descritos en la Ayuda, en función de los valores de configuración o de edición activos. Para cambiar la configuración, elija la opción Importar y exportar configuraciones en el menú Herramientas. Para obtener más información, vea Valores de configuración de Visual Studio.

Requisitos previos

Necesita los componentes siguientes para completar este tutorial:

  • Visual Studio 2008.

Crear el control personalizado

El primer paso consiste en crear el proyecto para el control personalizado. El control es un botón con poco código en tiempo de diseño, que utiliza el método GetIsInDesignMode para implementar un comportamiento en tiempo de diseño.

Para crear el control personalizado

  1. Cree un nuevo proyecto de biblioteca de controles personalizados de WPF en Visual Basic o en Visual C# denominado AutoSizeButtonLibrary.

    El código de CustomControl1 se abre en el editor de código.

  2. En el Explorador de soluciones, cambie el nombre del archivo de código a AutoSizeButton.cs o AutoSizeButton.vb. Si se muestra un cuadro de mensaje que le pregunta si desea cambiar el nombre de todas las referencias de este proyecto, haga clic en Sí.

  3. En el Explorador de soluciones, expanda la carpeta Temas.

  4. Haga doble clic en Generic.xaml.

    Generic.xaml se abrirá en WPF Designer.

  5. En la vista XAML, reemplace todas las apariciones de "CustomControl1" por "AutoSizeButton".

  6. Abra AutoSizeButton.cs o AutoSizeButton.vb en el editor de código.

  7. Reemplace el código generado automáticamente por el código siguiente. Este código hereda de Button y muestra el texto "Design mode active" cuando el botón aparece en el diseñador.

    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. Establezca la ruta de acceso de los resultados del proyecto en "bin\".

  9. Genere la solución.

Crear el ensamblado de metadatos en tiempo de diseño

El código de tiempo de diseño se implementa en ensamblados de metadatos especiales. Para este tutorial, el adorno personalizado se implementa en un ensamblado denominado AutoSizeButtonLibrary.VisualStudio.Design. Para obtener más información, vea Almacén de metadatos.

Para crear el ensamblado de metadatos en tiempo de diseño

  1. Agregue a la solución un nuevo proyecto de biblioteca de clases en Visual Basic o en Visual C# denominado AutoSizeButtonLibrary.VisualStudio.Design.

  2. Establezca la ruta de acceso de los resultados del proyecto en ".. \AutoSizeButtonLibrary\bin\". De este modo, el ensamblado del control y el ensamblado de metadatos permanecen en la misma carpeta, lo que permite que los diseñadores detecten los metadatos.

  3. Agregue referencias a los siguientes ensamblados de WPF.

    • PresentationCore

    • PresentationFramework

    • WindowsBase

  4. Agregue referencias a los siguientes ensamblados de WPF Designer.

    • Microsoft.Windows.Design

    • Microsoft.Windows.Design.Extensibility

    • Microsoft.Windows.Design.Interaction

  5. Agregue una referencia al proyecto AutoSizeButtonLibrary.

  6. En el Explorador de soluciones, cambie el nombre del archivo de código Class1 a Metadata.cs o Metadata.vb. Si se muestra un cuadro de mensaje que le pregunta si desea cambiar el nombre de todas las referencias de este proyecto, haga clic en Sí.

  7. Reemplace el código generado automáticamente por el código siguiente. Este código crea un objeto AttributeTable que asocia la implementación en tiempo de diseño personalizada a la clase 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. Guarde la solución.

Implementar el proveedor de adornos

El proveedor de adornos se implementa en un tipo denominado AutoSizeAdornerProvider. Este adorno FeatureProvider habilita la configuración de las propiedades Height y Width del control en tiempo de diseño.

Para implementar el proveedor de adornos

  1. Agregue una nueva clase denominada AutoSizeAdornerProvider al proyecto AutoSizeButtonLibrary.VisualStudio.Design.

  2. En el editor de código para AutoSizeAdornerProvider, reemplace el código generado automáticamente por el código siguiente. Este código implementa un objeto PrimarySelectionAdornerProvider que proporciona un adorno basado en un control 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. Genere la solución.

Probar la implementación en tiempo de diseño

Puede utilizar el control AutoSizeButton como cualquier otro control de WPF. WPF Designer administra la creación de todos los objetos en tiempo de diseño.

Para probar la implementación en tiempo de diseño

  1. Agregue a la solución un nuevo proyecto de aplicación WPF denominado DemoApplication.

    Window1.xaml se abrirá en el WPF Designer.

  2. Agregue una referencia al proyecto AutoSizeButtonLibrary.

  3. En la vista XAML, reemplace el código generado automáticamente por el código siguiente. Este XAML agrega una referencia al espacio de nombres AutoSizeButtonLibrary y agrega el control personalizado AutoSizeButton. El botón aparece en la vista Diseño con el texto "Design mode active", que indica que se encuentra en modo de diseño. Si el botón no aparece, es posible que tenga que hacer clic en la barra de información situada en la parte superior del diseñador para volver a cargar la vista.

    <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 la vista Diseño, haga clic en el control AutoSizeButton para seleccionarlo.

    Aparecerá un control CheckBox sobre el control AutoSizeButton.

  5. Desactive el adorno de la casilla.

    El control reduce su tamaño. El adorno de la casilla se mueve para mantener su posición con respecto al control adornado.

Establecer el proyecto para depuración en tiempo de diseño

Llegado este punto, ha completado la implementación en tiempo de diseño. Ahora puede usar Visual Studio para establecer puntos de interrupción y ejecutar paso a paso el código en tiempo de diseño. Para depurar la implementación en tiempo de diseño, asocie otra instancia de Visual Studio a la sesión actual de Visual Studio.

Para configurar el proyecto para la depuración en tiempo de diseño

  1. En el Explorador de soluciones, haga clic con el botón secundario en el proyecto DemoApplication y seleccione Establecer como proyecto de inicio.

  2. En el Explorador de soluciones, haga clic con el botón secundario en el proyecto DemoApplication y, a continuación, haga clic en Propiedades.

  3. En el Diseñador de proyectos de DemoApplication, haga clic en la ficha Depurar.

  4. En la sección Acción de inicio, seleccione Programa externo de inicio. Estará depurando una instancia independiente de Visual Studio.

  5. Haga clic en el botón de puntos suspensivos () para abrir el cuadro de diálogo Seleccionar archivo.

  6. Busque Visual Studio. El nombre del archivo ejecutable es devenv.exe, y si ha instalado Visual Studio en la ubicación predeterminada, la ruta de acceso será "%Archivos de programa%\Microsoft Visual Studio 9.0\Common7\IDE\devenv.exe".

  7. Haga clic en Abrir para seleccionar devenv.exe.

Depurar el control personalizado en tiempo de diseño

Ahora ya puede depurar el control personalizado cuando se ejecuta en modo de diseño. Cuando se inicie la sesión de depuración, se creará una nueva instancia de Visual Studio, y podrá utilizarla para cargar la solución AutoSizeButtonLibrary . Cuando se abre Window1.xaml en WPF Designer, se crea una instancia del control personalizado y comienza a ejecutarse.

Para depurar en tiempo de diseño el control personalizado

  1. Abra el archivo de código AutoSizeButton en el editor de código y agregue un punto de interrupción en el constructor.

  2. Abra Metadata.cs o Metadata.vb en el editor de código y agregue un punto de interrupción en el método Register.

  3. Abra AutoSizeAdornerProvider.cs o AutoSizeAdornerProvider.vb en el Editor de código y agregue un punto de interrupción en el constructor.

  4. Agregue los puntos de interrupción en el resto de los métodos para la clase AutoSizeAdornerProvider.

  5. Presione F5 para iniciar la depuración.

    Se crea una segunda instancia de Visual Studio. Puede distinguir entre la instancia de depuración y la segunda instancia de dos maneras:

    • La instancia de la depuración tiene la palabra Ejecutando en su barra de título.

    • La instancia de la depuración tiene el botón Iniciar en la barra de herramientas Depuración deshabilitado.

    El punto de interrupción se establece en la instancia de la depuración.

  6. En la segunda instancia de Visual Studio, abra la solución AutoSizeButtonLibrary.

  7. Abra Window1.xaml en WPF Designer.

    La instancia de depuración de Visual Studio adquiere el foco y la ejecución se detiene en el punto de interrupción en Register.

  8. Presione F5 para continuar con la depuración.

    La ejecución se detiene en el punto de interrupción en el constructor AutoSizeButton.

  9. Presione F5 para continuar con la depuración.

    La segunda instancia de Visual Studio adquiere el foco y aparece WPF Designer.

  10. En la vista Diseño, haga clic en el control AutoSizeButton para seleccionarlo.

    La instancia de depuración de Visual Studio adquiere el foco y la ejecución se detiene en el punto de interrupción en el constructor AutoSizeAdornerProvider.

  11. Presione F5 para continuar con la depuración.

    La ejecución se detiene en el punto de interrupción en el método Activate.

  12. Presione F5 para continuar con la depuración.

    La segunda instancia de Visual Studio adquiere el foco y aparece WPF Designer. El adorno de la casilla se muestra encima y a la izquierda de AutoSizeButton.

  13. Cuando haya terminado, puede detener la sesión de depuración cerrando la segunda instancia de Visual Studio o haciendo clic en el botón Detener depuración en la instancia de depuración.

Pasos siguientes

Puede agregar más características personalizadas en tiempo de diseño a los controles personalizados.

Vea también

Referencia

PrimarySelectionAdornerProvider

SkewTransform

Otros recursos

Conceptos de extensibilidad avanzada

Extensibilidad de WPF Designer