연습: 디자인 타임에 WPF 사용자 지정 컨트롤 디버깅

아티클
08/10/2011

이 연습에서는 WPF(Windows Presentation Foundation) 사용자 지정 컨트롤에 대한 디자인 타임 표시기(Adorner)를 디버깅하는 방법을 보여 줍니다. 표시기는 간단한 자동 크기 조정 기능을 제공하는 확인란입니다.

이 연습에서는 다음 작업을 수행합니다.

WPF 사용자 지정 컨트롤 라이브러리 프로젝트를 만듭니다.
디자인 타임 메타데이터를 위한 별도의 어셈블리를 만듭니다.
표시기 공급자를 구현합니다.
디자인 타임에 컨트롤을 테스트합니다.
디자인 타임 디버깅을 위해 프로젝트를 설정합니다.
디자인 타임에 컨트롤을 디버깅합니다.

이 연습을 마치면 사용자 지정 컨트롤에 대한 표시기를 디버깅하는 방법을 이해하게 됩니다.

참고

표시되는 대화 상자와 메뉴 명령은 활성 설정이나 버전에 따라 도움말에서 설명하는 것과 다를 수 있습니다. 설정을 변경하려면 도구 메뉴에서 설정 가져오기 및 내보내기를 선택합니다. 자세한 내용은 설정에 대한 작업을 참조하십시오.

사전 요구 사항

이 연습을 완료하려면 다음 구성 요소가 필요합니다.

Visual Studio 2010.

사용자 지정 컨트롤 만들기

첫 번째 단계로 사용자 지정 컨트롤에 대한 프로젝트를 만듭니다. 이 컨트롤은 디자인 타임 코드가 약간 사용되는 단추이며 이 코드에서는 GetIsInDesignMode 메서드를 사용하여 디자인 타임 동작을 구현합니다.

사용자 지정 컨트롤을 만들려면

Visual Basic 또는 Visual C#에서 AutoSizeButtonLibrary라는 새 WPF 사용자 지정 컨트롤 라이브러리 프로젝트를 만듭니다.

코드 편집기에 CustomControl1의 코드가 열립니다.
솔루션 탐색기에서 코드 파일의 이름을 AutoSizeButton.cs 또는 AutoSizeButton.vb로 변경합니다. 이 프로젝트의 모든 참조에서 이름을 바꿀지 묻는 메시지 상자가 표시되면 예를 클릭합니다.
코드 편집기에서 AutoSizeButton.cs 또는 AutoSizeButton.vb를 엽니다.

자동으로 생성된 코드를 다음 코드로 바꿉니다. 이 코드는 Button에서 상속되며 디자이너에서 단추가 나타날 때 "Design mode active"라는 텍스트를 표시합니다.

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";
            }
        }
    }
}

프로젝트의 출력 경로를 "bin\"으로 설정합니다.
솔루션을 빌드합니다.

디자인 타임 메타데이터 어셈블리 만들기

디자인 타임 코드는 특수 메타데이터 어셈블리에 배포됩니다. 이 연습에서 사용자 지정 표시기는 AutoSizeButtonLibrary.VisualStudio.Design이라는 어셈블리에 배포됩니다. 자세한 내용은 디자인 타임 메타데이터 제공를 참조하십시오.

디자인 타임 메타데이터 어셈블리를 만들려면

Visual Basic 또는 Visual C#에서 AutoSizeButtonLibrary.VisualStudio.Design이라는 새 클래스 라이브러리 프로젝트를 솔루션에 추가합니다.
프로젝트의 출력 경로를 ".. \AutoSizeButtonLibrary\bin\"으로 설정합니다. 이렇게 하면 컨트롤의 어셈블리와 메타데이터 어셈블리가 같은 폴더에 유지되므로 디자이너에서 메타데이터를 검색할 수 있습니다.
다음 WPF 어셈블리에 대한 참조를 추가합니다.
- PresentationCore
- PresentationFramework
- System.Xaml
- WindowsBase
다음 WPF Designer 어셈블리에 대한 참조를 추가합니다.
- Microsoft.Windows.Design.Extensibility
- Microsoft.Windows.Design.Interaction
AutoSizeButtonLibrary 프로젝트에 대한 참조를 추가합니다.
솔루션 탐색기에서 Class1 코드 파일의 이름을 Metadata.cs 또는 Metadata.vb로 변경합니다. 이 프로젝트의 모든 참조에서 이름을 바꿀지 묻는 메시지 상자가 표시되면 예를 클릭합니다.

자동으로 생성된 코드를 다음 코드로 바꿉니다. 이 코드는 사용자 지정 디자인 타임 구현을 AutoSizeButton 클래스에 연결하는 AttributeTable을 만듭니다.

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

' The ProvideMetadata assembly-level attribute indicates to designers
' that this assembly contains a class that provides an attribute table. 
<Assembly: ProvideMetadata(GetType(AutoSizeButtonLibrary.VisualStudio.Design.Metadata))> 

' Container for any general design-time metadata to initialize.
' Designers look for a type in the design-time assembly that 
' implements IProvideAttributeTable. If found, designers instantiate
' this class and access its AttributeTable property automatically.
Friend Class Metadata
    Implements IProvideAttributeTable

    ' Accessed by the designer to register any design-time metadata.
    Public ReadOnly Property AttributeTable() As AttributeTable _
        Implements IProvideAttributeTable.AttributeTable
        Get
            Dim builder As New AttributeTableBuilder()

            builder.AddCustomAttributes( _
                GetType(AutoSizeButton), _
                New FeatureAttribute(GetType(AutoSizeAdornerProvider)))

            Return builder.CreateTable()
        End Get
    End Property
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;

// The ProvideMetadata assembly-level attribute indicates to designers
// that this assembly contains a class that provides an attribute table. 
[assembly: ProvideMetadata(typeof(AutoSizeButtonLibrary.VisualStudio.Design.Metadata))]
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 IProvideAttributeTable. If found, designers instantiate 
    // this class and access its AttributeTable property automatically.
    internal class Metadata : IProvideAttributeTable
    {
        // Accessed by the designer to register any design-time metadata.
        public AttributeTable AttributeTable
        {
            get 
            {
                AttributeTableBuilder builder = new AttributeTableBuilder();

                builder.AddCustomAttributes(
                    typeof(AutoSizeButton),
                    new FeatureAttribute(typeof(AutoSizeAdornerProvider)));

                return builder.CreateTable();
            }
        }
    }
}

솔루션을 저장합니다.

표시기 공급자 구현

표시기 공급자는 AutoSizeAdornerProvider라는 형식으로 구현됩니다. 이 표시기 FeatureProvider를 사용하여 디자인 타임에 컨트롤의 Height 및 Width 속성을 설정할 수 있습니다.

표시기 공급자를 구현하려면

AutoSizeButtonLibrary.VisualStudio.Design 프로젝트에 AutoSizeAdornerProvider라는 새 클래스를 추가합니다.

AutoSizeAdornerProvider에 대한 코드 편집기에서 자동으로 생성된 코드를 다음 코드로 바꿉니다. 이 코드는 CheckBox 컨트롤을 기반으로 표시기를 제공하는 PrimarySelectionAdornerProvider를 구현합니다.

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)

        ' 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.
        AdornerPanel.SetAdornerHorizontalAlignment(autoSizeCheckBox, AdornerHorizontalAlignment.OutsideLeft)
        AdornerPanel.SetAdornerVerticalAlignment(autoSizeCheckBox, AdornerVerticalAlignment.OutsideTop)

        ' 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)

    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("Width")

            Dim heightProperty As ModelProperty = adornedControlModel.Properties("Height")

            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("Height").ComputedValue, Double)
            Dim w As Double = CType(adornedControlModel.Properties("Width").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)
        {
            // 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.
            AdornerPanel.SetAdornerHorizontalAlignment(autoSizeCheckBox, AdornerHorizontalAlignment.OutsideLeft);
            AdornerPanel.SetAdornerVerticalAlignment(autoSizeCheckBox, AdornerVerticalAlignment.OutsideTop);

            // 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);
        }

        // 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["Width"];

                ModelProperty heightProperty =
                    adornedControlModel.Properties["Height"];

                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["Height"].ComputedValue;
                double w = (double)adornedControlModel.Properties["Width"].ComputedValue;

                autoSizeCheckBox.IsChecked = (h == double.NaN && w == double.NaN) ? true : false;
            }
        }
    }
}

솔루션을 빌드합니다.

디자인 타임 구현 테스트

AutoSizeButton 컨트롤을 다른 WPF 컨트롤과 같은 방식으로 사용할 수 있습니다. WPF Designer에서는 모든 디자인 타임 개체의 생성을 처리합니다.

디자인 타임 구현을 테스트하려면

DemoApplication이라는 새 WPF 응용 프로그램 프로젝트를 솔루션에 추가합니다.

WPF Designer에 MainWindow.xaml이 열립니다.
AutoSizeButtonLibrary 프로젝트에 대한 참조를 추가합니다.
XAML 뷰에서 자동으로 생성된 코드를 다음 코드로 바꿉니다. 이 XAML은 AutoSizeButtonLibrary 네임스페이스에 대한 참조를 추가하고 AutoSizeButton 사용자 지정 컨트롤을 추가합니다. 디자인 뷰에서 단추가 "Design mode active"라는 텍스트와 함께 표시되어 디자인 모드임을 나타냅니다. 단추가 표시되지 않는 경우 디자이너 위쪽의 정보 표시줄을 클릭하여 뷰를 다시 로드해야 할 수 있습니다.
```
<Window x:Class="DemoApplication.MainWindow"
    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>
```
디자인 뷰에서 AutoSizeButton 컨트롤을 클릭하여 선택합니다.

CheckBox 컨트롤이 AutoSizeButton 컨트롤 위에 나타납니다.
확인란 표시기의 선택을 취소합니다.

컨트롤의 크기가 줄어듭니다. 표시된 컨트롤을 기준으로 한 위치를 유지하기 위해 확인란 표시기가 이동합니다.

디자인 타임 디버깅을 위한 프로젝트 설정

지금까지 디자인 타임 구현을 완료했습니다. 이제 Visual Studio를 사용하여 중단점을 설정하고 디자인 타임 코드를 한 단계씩 실행할 수 있습니다. 디자인 타임 구현을 디버깅하려면 현재 Visual Studio 세션에 Visual Studio의 다른 인스턴스를 연결합니다.

디자인 타임 디버깅을 위해 프로젝트를 설정하려면

솔루션 탐색기에서 DemoApplication 프로젝트를 마우스 오른쪽 단추로 클릭한 다음 시작 프로젝트로 설정을 클릭합니다.
솔루션 탐색기에서 DemoApplication 프로젝트를 마우스 오른쪽 단추로 클릭한 다음 속성을 선택합니다.
DemoApplication 프로젝트 디자이너에서 디버그 탭을 클릭합니다.
시작 작업 섹션에서 시작 외부 프로그램을 선택합니다. Visual Studio의 개별 인스턴스를 디버깅합니다.
줄임표() 단추를 클릭하여 파일 선택 대화 상자를 엽니다.
Visual Studio를 찾습니다. 실행 파일의 이름은 devenv.exe이며 Visual Studio를 기본 위치에 설치한 경우 그 경로는 "%programfiles%\Microsoft Visual Studio 9.0\Common7\IDE\devenv.exe"입니다.
열기를 클릭하여 devenv.exe를 선택합니다.

디자인 타임에 사용자 지정 컨트롤 디버깅

이제 디자인 모드에서 실행될 때처럼 사용자 지정 컨트롤을 디버깅할 수 있습니다. 디버깅 세션을 시작하면 Visual Studio의 새 인스턴스가 만들어지고 해당 인스턴스를 사용하여 AutoSizeButtonLibrary 솔루션을 로드합니다. WPF Designer에서 MainWindow.xaml을 열면 사용자 지정 컨트롤의 인스턴스가 만들어지고 실행됩니다.

디자인 타임에 사용자 지정 컨트롤을 디버깅하려면

코드 편집기에서 AutoSizeButton 코드 파일을 열고 생성자에 중단점을 추가합니다.
코드 편집기에서 Metadata.cs 또는 Metadata.vb를 열고 AttributeTable 속성에 중단점을 추가합니다.
코드 편집기에서 AutoSizeAdornerProvider.cs 또는 AutoSizeAdornerProvider.vb를 열고 생성자에 중단점을 추가합니다.
AutoSizeAdornerProvider 클래스의 나머지 메서드에 중단점을 추가합니다.
F5 키를 눌러 디버깅 세션을 시작합니다.

Visual Studio의 두 번째 인스턴스가 만들어집니다. 디버깅 인스턴스와 두 번째 인스턴스는 다음과 같은 두 가지 방법으로 구별할 수 있습니다.
- 디버깅 인스턴스는 제목 표시줄에 실행 중이라는 단어가 있습니다.
- 디버깅 인스턴스는 디버그 도구 모음의 시작 단추가 비활성화되어 있습니다.
중단점이 디버깅 인스턴스에 설정됩니다.
Visual Studio의 두 번째 인스턴스에서 AutoSizeButtonLibrary 솔루션을 엽니다.
WPF Designer에서 MainWindow.xaml을 엽니다.

Visual Studio의 디버깅 인스턴스에 포커스가 놓이고 AttributeTable 속성의 중단점에서 실행이 중지됩니다.
F5 키를 눌러 디버깅을 계속합니다.

AutoSizeButton 생성자의 중단점에서 실행이 중지됩니다.
F5 키를 눌러 디버깅을 계속합니다.

Visual Studio의 두 번째 인스턴스에 포커스가 부여되고 WPF Designer가 표시됩니다.
디자인 뷰에서 AutoSizeButton 컨트롤을 클릭하여 선택합니다.

Visual Studio의 디버깅 인스턴스에 포커스가 부여되고 AutoSizeAdornerProvider 생성자의 중단점에서 실행이 중지됩니다.
F5 키를 눌러 디버깅을 계속합니다.

Activate 메서드의 중단점에서 실행이 중지됩니다.
F5 키를 눌러 디버깅을 계속합니다.

Visual Studio의 두 번째 인스턴스에 포커스가 부여되고 WPF Designer가 표시됩니다. 확인란 표시기가 AutoSizeButton의 위쪽과 왼쪽에 나타납니다.
완료되면 Visual Studio의 두 번째 인스턴스를 닫거나 디버깅 인스턴스에서 디버깅 중지 단추를 클릭하여 디버깅 세션을 중지할 수 있습니다.

다음 단계

사용자 지정 컨트롤에 사용자 지정 디자인 타임 기능을 더 추가할 수 있습니다.

컨트롤의 디자인 타임에 사용자 지정 표시기를 추가합니다. 자세한 내용은 연습: 디자인 타임 표시기 만들기를 참조하십시오.
속성 창에서 사용할 수 있는 사용자 지정 형식에 대한 편집기를 만듭니다. 자세한 내용은 방법: 값 편집기 만들기를 참조하십시오.
속성 창에서 사용할 수 있는 색 편집기를 만듭니다. 자세한 내용은 연습: 색 편집기 구현을 참조하십시오.

참고 항목

다음을 통해 공유