4. 컨트롤 사용하기

Control

 

컨트롤의 클래스 라이브러리 ---(MXML or ActionScript 통한 인트턴스화)---> API

 

이미지 나타내기

* 컴파일시 이미지를 SWF로 변환

<mx:Image source="assets/dairy_milk.jpg" scaleContent="true"/>

--> <mx:Image source="@Embed('assets/dairy_milk.jpg')" scaleContent="true"/>

 

데이터 바인딩 {}

(간단한 컨트롤에서 데이터 구조를 링크하기 위해서)

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    creationComplete="lbl1.text='caption1'; lbl2.text='caption2';">

    <mx:Script>
        <![CDATA[
           [Bindable]public var caption1:String = "Caption1";        
                          public var caption2:String = "Caption2";
        ]]>
    </mx:Script>
   

    <mx:Label id="lbl1"  text="Label1"/>
    <mx:Label id="lbl2"  text="Label2"/>

<!--값변경-->

    <mx:Button x="121" y="143" label="Button1" click="caption1='OKOK';click="caption2='NoNo';""/>

레이블객체(Label1)와 변수값(caption1)을 연결하고 싶을때
Source값이 바뀌면 destination의 값이 변경

     <mx:Binding source="caption1" destination="lbl1.text"/>
     <mx:Binding source="caption2" destination="lbl2.text"/>

</mx:Application>

 

==> <mx:Binding>을 대신해서 {} 사용

<mx:Label id="lbl1"  text="{caption1}"/>
<mx:Label id="lbl2"  text="{caption2}"/>

 

* 구조화한 데이터(xml) 모델(창고)

<mx:Model id="groceryInventory">
    <groceries>
        <catName>Dairy</catName>
        <prodName>Milk</prodName>
        <imageName>assets/dairy_milk.jpg</imageName>
        <cost>1.20</cost>
        <listPrice>1.99</listPrice>
        <isOrganic>true</isOrganic>
        <isLowFat>true</isLowFat>
        <description>Direct from California where cows are happiest!</description>
    </groceries>
</mx:Model>

 

--> 꺼내기

<mx:Text text="{groceryInventory.description}"/>

 

* 객체 = 거시기…^^; 

폼 (레이아웃) 컨테이너

(간단한 컨트롤을 레이아웃하기 위해서)

 

 

<mx:Button label="Browse"     click="var myFileRef:FileReferenceList =new FileReferenceList();
                                                 myFileRef.browse();"/>

 

==>

<mx:Script>
    <![CDATA[

        import flash.net.FileReferenceList

        public function fileBrowse():void{
            var myFileRef:FileReferenceList =new FileReferenceList();
            myFileRef.browse();               
        }
    ]]>
</mx:Script>

<mx:Button label="Browse"    click="fileBrowse();"/>

 

Dashboard에 라디오 버튼들과 데이트 필드 추가하기

 

 

 

*************************************************

http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html

http://examples.adobe.com/flex2/inproduct/sdk/explorer/explorer.html

**************************************