실버라이트 사용자 컨트롤의 메타데이터: TemplatePart와 TemplateVisualState는 어떤 의미인가?

실버라이트 사용자 중 상당수는 처음으로 접한 외부 컨트롤이 WatermarkedTextBox일 것이다. 마이크로소프트의 부사장 ScottGu가 쓴 Building a Digg Search Client가 가장 인기 있는 튜토리얼인데 그 튜토리얼에서 WatermarkedTextBox를 다루고 있었다.

WatermarkedTextBox 컨트롤은 blog.msdn.com을 통해서 쉽게 구할 수 있는데 코드 뿐만 아니라 소스도 모두 공개되어있다. 공개된 코드는 실버라이트의 내부를 조금 들추어 볼 수 있게 한다. 하지만 WatermarkedTextBox 컨트롤을 들추어 보는 것은 쉽지 않다. 메타데이터, 생소한 인터페이스로 무장되어 있기 때문이다. 아래의 내용은 WatermarkedTextBox 내에 존재하는 메타데이터다.

    [TemplatePart(Name = WatermarkedTextBox.ElementContentName, Type = typeof(ContentControl))]
    [TemplateVisualState(Name = VisualStateHelper.StateNormal, GroupName = VisualStateHelper.GroupCommon)]
    [TemplateVisualState(Name = VisualStateHelper.StateMouseOver, GroupName = VisualStateHelper.GroupCommon)]
    [TemplateVisualState(Name = VisualStateHelper.StateDisabled, GroupName = VisualStateHelper.GroupCommon)]
    [TemplateVisualState(Name = VisualStateHelper.StateUnfocused, GroupName = VisualStateHelper.GroupFocus)]
    [TemplateVisualState(Name = VisualStateHelper.StateFocused, GroupName = VisualStateHelper.GroupFocus)]
    [TemplateVisualState(Name = VisualStateHelper.StateUnwatermarked, GroupName = VisualStateHelper.GroupWatermark)]
    [TemplateVisualState(Name = VisualStateHelper.StateWatermarked, GroupName = VisualStateHelper.GroupWatermark)]

열거된 코드를 보고 비주얼 스튜디오 상단 오른쪽에 있는 X버튼을 클릭한 사람이 한 둘이 아니라 생각한다. 이 글은 비주얼 스튜디오의 프로세스가 메모리에 더 오래 있길 기원하며 작성했다. 물론 많은 이들의 사용자 컨트롤에 대한 두려움을 조금 덜어주고자 하는 의도도 있고.

코드는 크게 둘로 나눌 수 있는데 TemplatePart와 TemplateVisualState이다. 사용자 컨트롤은 여러 부분의 합으로 구성되는데 TempatePart는 사용자 컨트롤의 한 부분이다. WatermarkedTextBox는 단순한 컨트롤이기 때문에 하나의 부분으로 이루어져 있다. TemplatePart에서 Name과 Type을 받고 있는데 Name은 부분의 이름이며 Type은 그 부분에 대해 기대하는 형이다. WatermarkedTextBox.ElementContentName의 이름을 기대하고 ContentControl의 타입을 기대하고 있다. 저 길다란 이름이 공포스러울 수 있다. 마음을 다 잡고 다시 살펴보면 이름의 가운데 .이 있다. WatermarkedTextBox의 속성이라는 것. 검색 기능을 이용하여 프로젝트의 항목을 뒤져보자.

namespace Microsoft.Windows.Controls
{
    ...
    public partial class WatermarkedTextBox : TextBox
    {
    ...
        private const string ElementContentName = "Watermark";
    ...
    }
...
}

알고보면 별 것 아니다. WatermarkedTextBox.ElementContentName은 “Watermark”라는 스트링 문자열이라는 것. 이전에 코드에 나왔던 Name들은 모두 문자열을 직접입력하지 않고 별도로 정의한 것을 대입하였다.

타입은 ContentControl로 되어 있다. 이 컨트롤에 대해 잘 모른다면 사용자가 정의한 배경, 색상, 폰트 등으로 컨텐츠를 표기해주는 컨트롤이라고 알아두자.

다음으로 TemplateVisualState가 나열되어 있다. VisualStateManager에 필요한 여러 상태와 그 상태를 묶는 그룹들을 나열한다. 역시 이 항목에 대해 잘 모른다면 상태에 따라 컨트롤의 모양을 꾸며주는 것으로 알아두자. WatermarkedTextBox가 미러 정해둔 속성과 그룹의 문자열은 다음과 같다.

namespace Microsoft.Windows.Controls
{
    ...
    internal static class VisualStateHelper
    {
        public const string GroupCommon = "CommonStates";
        public const string GroupFocus = "FocusStates";
        public const string GroupSelection = "SelectionStates";
        public const string GroupWatermark = "WatermarkStates";
        public const string StateDisabled = "Disabled";
        public const string StateFocused = "Focused";
        public const string StateMouseOver = "MouseOver";
        public const string StateNormal = "Normal";
        public const string StateUnfocused = "Unfocused";
        public const string StateUnwatermarked = "Unwatermarked";
        public const string StateWatermarked = "Watermarked";
        ...
    }
....
}

이 문자열들을 TemplateVisualState가 이용하여 7개의 속성을 포함하는 4개의 그룹이 만들어지게 된다.

TemplatePart와 TemplateVisualState를 작성하면 사용자 컨트롤에 필요한 메타데이터가 구성된다. 일부 사람들은 이 메터데이터를 로직에서 어떻게 이용할 것이냐 궁금할 수 있다. 거기에 대한 답은 조금 실망스러울 수도 있는데 이 메터데이터는 사용자 컨트롤의 로직이나 이 컨트롤을 사용하는 프로그램의 로직과는 무관하다. 어떤 로직과도 연관되지 않으며 오로지 실버라이트 사용자 컨트롤을 다루는 “도구”하고만 연관되게 된다. 이 메터데이터는 실버라이트 도구에게 컨트롤에 대한 힌트를 제공하여 우리가 보다 쉽게 컨트롤을 이용할 수 있게 한다.

Blog URL

(defun world() 'hello world)

Date

2009-10-11 01:50 am

태그

custom control silverlight templatepart templatevisualstate 실버라이트