지돌스타의 RIA와 천문프로그래밍

지금 소개하는 DefaultProperty  Metadata 태그는 다른 Metadata 태그(Embed, Effect, Event등)에 비해 중요도 면에서는 떨어진다. 하지만 알고 있으면 Flex SDK에서 사용하는 몇몇 컴포넌트의 사용법에 대해서 좀더 이해할 수 있겠다.

1. DefaultProperty Metadata 태그의 이해

[DefaultProperty]는 컴포넌트의 기본속성이 무엇인가 설정한다. 가령, List 계열인 List, DataGrid의 기본 속성은 무엇일까? 아마도 dataProvider가 되겠다.

실제로 List.as, DataGrid.as, ComboBox.as 등의 코드를 보면 클래스 정의 앞에 [DefaultProperty("dataProvider")]가 있다. 아래 코드는 List.as의 내부 모습이다.

package mx.controls

{

…(생략)

 

[DefaultProperty("dataProvider")]

 

…(생략)

 

public class List extends ListBase implements IIMESupport

{

        …(생략)

}

}

 

그럼 [DefaultProperty]의 역할은 무엇일까? 예를 들어보면서 그 역할을 알아보자.

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*">

        <!-- 방법 1. 태그 속성 사용 -->

        <mx:List dataProvider="{[1,2,3,4]}"/>

       

        <!-- 방법 2. 자식(child) 태그를 사용 -->

        <mx:List>

               <mx:dataProvider>[1,2,3,4]</mx:dataProvider>

        </mx:List>    

       

        <!-- 방법 3. DefaultProperty Metadata tag를 사용 -->

        <mx:List>[1,2,3,4]</mx:List>

</mx:Application>

 

위 코드는 다양한 방법으로 List 컴포넌트의 dataProvider속성을 통해 데이터를 넘겨주는 방법을 보여주고 있다. 위 코드에서 "방법 1", "방법 2"의 경우 금방 이해할 수 있을 것이다. 그러나 "방법 3"의 경우 [DefaultProperty]를 모른다면 알 수 없다. "방법 3"이 가능한 이유는 List.as 클래스명 앞에 [DefaultProperty("dataProvider")]를 사용한 결과이다. 즉, dataProvider 속성명을 사용하지 않고도 직접 dataProvider에 데이터를 넘겨줄 수 있다.

결국 [DefaultProperty] Metadata 태그의 역할은 MXML에서 컴포넌트의 기본 속성을 생략해서 사용해도 무방할 수 있도록 하는 것이다.

2. DefaultProperty Metadata 태그 활용해보기

Label 속성의 기본속성은 무엇일까? 아무래도 text가 될 것이다. 하지만 Flex SDK 3의 Label 속성은 [DefaultProperty]에 의해 기본 속성으로 설정되어 있지 않다. Label.as를 직접 보면 알 수 있을것이다.

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >

        <!-- 방법 1. 태그 속성 사용 -->

        <mx:Label text="Hello"/>

 

        <!-- 방법 2. 자식(child) 태그를 사용 -->

        <mx:Label>

            <mx:text>Hello</mx:text>

        </mx:Label>

       

        <!-- 방법 3. (에러발생)Default Properties Metadata tag를 사용 -->

        <local:Label>Hello</local:Label>

</mx:Application>

그래서 Label을 위 코드대로 "방법 3"처럼 사용하면 List와 다르게 "Could not resolve <local:Label> to a component implementation" 에러를 발생시킨다. Label을 확장해서 기본속성을 text로 지정하여 에러를 없애보자.

아래 코드와 같이 Label을 확장하여 ExLabel을 만들고 [DefaultProperty("text")]를 Class 앞에 삽입한다.

package

{

        import mx.controls.Label;

        [DefaultProperty("text")]

        public class ExLabel extends Label

        {

               public function ExLabel()

               {

                       super();

               }

        }

}

방금 만든 ExLabel을 아래와 같이 사용하면 되겠다.

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*">

        <!-- 방법 1. 태그 속성 사용 -->

        <local:ExLabel text="Hello"/>

 

        <!-- 방법 2. 자식(child) 태그를 사용 -->

        <local:ExLabel>

            <local:text>Hello</local:text>

        </local:ExLabel>

       

        <!-- 방법 3. DefaultProperty Metadata tag를 사용 -->

        <local:ExLabel>Hello</local:ExLabel>

</mx:Application>

별로 어렵지 않게 사용할 수 있는 것인데, 모르면 이해가 안되는 부분이기 때문에 정리했다.

참고자료

http://gogothing.tistory.com/43
http://flexdocs.kr/docs/flex2/docs/00001712.html#969815


글쓴이 : 지돌스타(http://blog.jidolstar.com/377)