DGComboBox

Openzet.org

목차 1 소개 2 속성 3 사용법 4 애플리케이션 예제

소개

DGComboBox는 ZetComboBox 클래스를 상속한 클래스로서, ZetComboBox에서 구현하고 있는 기본 기능들을 토대로 dropdown으로 데이터그리드를 사용하는 커스텀 콤보박스 컴포넌트이다 이 컴포넌트의 dataProvider로는 일반 데이터그리드에 사용되는 데이터 프로바이더를 사용한다. 이 컴포넌트의 selectedItem은 드롭다운으로 사용되는 데이터그리드의 selectedItem을 반환한다.

속성

dropdownHeight 드롭다운되는 데이터그리드의 높이를 설정하기 위한 속성이다 특별히 이 속성은 dropdown으로 트리 컨트롤이 사용될 때 유용하다. selectedItem 드롭다운으로 사용되는 데이터그리드의 아이템을 반환하는 속성이다

사용법

일반적인 사용법은 아래 코드와 같다.

<zet:DGComboBox id="dgCombo" dataProvider ="{arr}" prompt="select one"  dropdownWidth="200" />

이 코드에 바인딩시키는 데이터 프로바이더의 예는 다음과 같다.

[Bindable]
                        public var arr:ArrayCollection = new ArrayCollection([
                        {A:10, B:20, C:30},
                        {A:20, B:30, C:40},
                        {A:30, B:40, C:50},
                        {A:40, B:50, C:60},
                        {A:50, B:60, C:70}]);

이 때 앞의 코드의 arr이라는 ArrayCollection 객체는 DGComboBox의 내부 로직에 의해 하나의 Object 객체로 래핑되어, 드롭다운으로 나타나는 데이터그리드에 바인딩된다.

애플리케이션 예제

다음은 DGComboBox에 대한 애플리케이션 예제 코드이다

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
        xmlns:zet="org.openzet.controls.*" creationComplete="init();">
        <mx:Script>
                <![CDATA[
                        import org.openzet.utils.DataUtil;
                        import org.openzet.utils.DataGridUtil;
                        import mx.collections.ArrayCollection;
 
                        [Bindable]
                        public var arr:ArrayCollection = new ArrayCollection([
                        {A:10, B:20, C:30},
                        {A:20, B:30, C:40},
                        {A:30, B:40, C:50},
                        {A:40, B:50, C:60},
                        {A:50, B:60, C:70}]);
 
                ]]>
        </mx:Script>
        <zet:DGComboBox id="dgCombo" prompt="select one" dataProvider="{arr}" dropdownWidth="200"  />
</mx:Application>