태터데스크 관리자

도움말
닫기
적용하기   첫페이지 만들기

태터데스크 메시지

저장하였습니다.
김대중 전 대통령 서거 추모글 남기기

예제로 배우는 Flex2009.04.20 01:51

2. List, HorizontalList, TileList, DataGrid, Tree의 공통점

 [그림2]는 위에서부터 List, HorizontalList, TileList, DataGrid, Tree를 보여주고 있다렌더러를 설명하는데 이런 컴포넌트들을 예로 드는 이유는 이들 사이에 공통점이 있기 때문이다.


[예제2] 소스코드를 보면 모두 같은 데이터(ArrayCollection)을 사용하고 있다그 이유는 이 컴포넌트들은 ListBase라는 클래스를 확장하여 만들었기 때문이다그리고 여기서 설명하려는itemRenderer를 똑같이 적용할 수 있는 컴포넌트란 것이 중요한 공통점이다.


[그림2] List, HorizontalList, TileList, DataGrid, Tree의 기본적인 사용


[예제2] RDExam02.mxml

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

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

       <mx:Script>

             <![CDATA[

                    import mx.collections.ArrayCollection;

                    [Bindable] private var data_ac:ArrayCollection = new ArrayCollection([

                           {no:1, label:'한국', data:'K'},

                           {no:2, label:'미국', data:'A'},

                           {no:3, label:'중국', data:'C'},

                           {no:4, label:'일본', data:'J'}                       

                    ]);

             ]]>

       </mx:Script>

       <mx:List dataProvider="{data_ac}" width="450" height="100%"/>

       <mx:HorizontalList dataProvider="{data_ac}" width="450" height="100%"/>

       <mx:TileList dataProvider="{data_ac}" width="450" height="100%"/>

       <mx:DataGrid dataProvider="{data_ac}" width="450" height="100%">

             <mx:columns>

                    <mx:DataGridColumn dataField="no" headerText="번호"/>

                    <mx:DataGridColumn dataField="label" headerText="국가"/>

                    <mx:DataGridColumn dataField="data" headerText="국기"/>

             </mx:columns>

       </mx:DataGrid>

       <mx:Tree dataProvider="{data_ac}" width="450" height="100%"/>    

</mx:Application>

 



Posted by okgosu

티스토리 툴바