태터데스크 관리자

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

태터데스크 메시지

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

예제로 배우는 Flex2009.04.20 02:06

6. itemRenderer에서 set data()함수의 사용

itemRenderer가 넘겨주는 데이터를 data라는 객체로 받았는데넘어오는 데이터를 가공해야 할 경우에는 set data()함수를 재정의(override)하여야 한다

[예제 6] set data()함수를 재정의하여 label과 이미지경로 변수에 넣어주는 예제이다. [예제6]을 보면 RDExam06RD.mxml이란 itemRenderer set data()함수를 재정의하였다이때 itemRenderer의 객체들의 생성되지 않았기 때문에 set data()함수에서 값을 넣으려 하면 에러가 난다그래서 lblText, src라는 변수를 두어 값을 넣고 이를Label, Image컴포넌트에 바인딩하여 데이터를 보여준다.

 

[예제6] RDExam06.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%" itemRenderer="RDExam06RD"/>

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

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

       <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="국기" itemRenderer="RDExam06RD"/>

             </mx:columns>

       </mx:DataGrid>

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

</mx:Application>

  

[예제6-1] RDExam06Renderer.mxml(itremRenderer)

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

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

<mx:Script>

       <![CDATA[

             [Bindable] private var lblText:String;

             [Bindable] private var src:String;

             override public function set data(data:Object):void {        

                 if(data != null) {

                           lblText = "[" + data.label + "]";

                           src = data.data + ".gif";

                 }   

             }

       ]]>

</mx:Script>

       <mx:Label id="lbl" text="{lblText}"/>

       <mx:Image id="img" source="{src}" width="100" height="60"/>

</mx:VBox>



Posted by okgosu

티스토리 툴바