[Flex 3.0] Adobe Flex3 실전 트레이닝북 동영상 - LESSON 5: 이벤트 핸들링과 데이터 구조

FLEX/Adobe Flex3 실전 트레이닝북 2010. 7. 12. 21:51

  • LESSON 5: 이벤트 핸들링과 데이터 구조

  • --------------------------------------------------------------------
    [Test1.mxml]
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
     initialize="init();">
     <mx:Script>
      <![CDATA[
       
       public function init():void
       {
        MyButton.addEventListener(MouseEvent.CLICK, clickHandler);
       }
       
       private function clickHandler(event:MouseEvent):void
       {
        myL.text = "Hello";
       }
       
      ]]>
     </mx:Script>
     
     <mx:Label x="253" y="101" text="Label" id="myL"/>
     <mx:Button x="253" y="139" label="Button" id="MyButton"/>
     <!--<mx:Button x="253" y="139" label="Button" id="MyButton" click="myL.text='okok';"/>-->

     <!-- 속성중에 번개 표시는 이벤트라는것 -->
     
     <!-- 해당 버튼에게 Event을 등록시키는 방법은 addEventListener를 사용한다. 첫번째는 이벤트명, 두번째는 이벤트를 처리하는 function명 -->
     
     <!-- 이벤트 발생 순서 : initialize 이벤트 -> init 이벤트 -> MyButton addEventListener 이벤트 -> Click 이벤트 -->
     
     <!-- 이벤트를 등록하는 3가지 방법
      1. 바로 mxml tag내에  등록하는 방법  <mx:Button click="myL.text='okok'/>
      2. script function을 작성하여 function명을 등록하는 방법 <mx:Button click='clickHandler();'/>
      3. 객체에 addEventListener를 사용하여 등록하는 방법  MyButton.addEventListener(MouseEvent.CLICK, clickHandler);
     -->
     
    </mx:Application>

    -----------------------------------------------------------------------------------------
    [Test2.mxml]
    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
     creationComplete="addToTextArea('Application');">
     
     <mx:Script>
      <![CDATA[
       
       private function addToTextArea(str:String):void
       {
        ta.text = ta.text + str + "\n";
       }
       
      ]]>
     </mx:Script>
     
     <mx:HBox x="74" y="38" width="163" height="29" creationComplete="addToTextArea('HBox')">
      <mx:Label text="Label" creationComplete="addToTextArea('Label')"/>
      <mx:Button label="Button" creationComplete="addToTextArea('Button')"/>
     </mx:HBox>
     <mx:TextArea x="74" y="102" height="227" width="209" id="ta"/>
     
     <!-- creationComplete 이벤트는 제일 안쪽(child)가 먼저 발생된다. Label -> Button -> HBox -> Application순으로 발생
      creationComplete는 컴퍼넌트가 출력된 후 발생된다.
      1. 배치완료(위치확정후)
      2. 컴포넌트가 출력된후
      3. creationComplete Event 발생-->
     
     <!-- initialize 이벤트는 자식 컴포넌트가 생성완료. 자식의 속성 초기화 완료후 호출된다.
      1. 자식 컴포넌트 생성
      2. 자식의 속성 초기화 완료
      3. initialize Event 발생
      4. 배치완료(위치확정후)
      5. 컴포넌트가 출력된후
      6. creationComplete Event 발생 -->
     
     
    </mx:Application>

    ------------------------------------------------------------------------------------
    :