LuNA`s Dev

 <mx:Script>
  <![CDATA[
   
   private function onClick(event:MouseEvent):void{
    trace("hello");
   }

   // Add event 를 클릭하면 btn 에 마우스 이벤트를 등록하여
   // 앞으로 btn을 클릭하였을때 oncClick 함수를 실행하도록 한다.
   private function addEvent():void{
    btn.addEventListener(MouseEvent.CLICK, onClick);
   }  
   
   
   // Remove event 를 클릭하면 btn 에 마우스 이벤트를 삭제하여
   // 앞으로 btn을 클릭해도 아무 반응이 없게 한다.
    private function removeEvent():void{
    btn.removeEventListener(MouseEvent.CLICK, onClick);
   }
  ]]>
 </mx:Script>
 
 <mx:Button id="btn" label="hi" />
 <mx:Button label="add event" click="addEvent()"/>
 <mx:Button label="remove event" click="removeEvent()" />

private var dataAC:ArrayCollection = new ArrayCollection([
   // 생성자에 parameter를 줄 경우에는 {} 로 감싸 표현해 준다. JSON과 비슷..
    {label:"월요일", day:17},
    {label:"화요일", day:18},
    {label:"수요일", day:19},
    {label:"목요일", day:20},
    {label:"금요일", day:21}    
   ]);


JSON 과 비슷한 경향을 보인다.

저런식으로 해 놓으면 아래와 같이
Repeater를 이용하여 반복 출력 할 수 있다.

<mx:Repeater id="rp" dataProvider="{dataAC}">
 <!--
  id의 currentItem으로 접근하면 현재 돌아가고 Collection index의 데이터가 온다.
  Repeater는 타 반복문과 비슷하지만 반복의 시작과 종료를 정할 수 있는 for문과 달리
  dataProvider에 Binding되어 있는 데이터, 즉 ArrayCollection의 길이만큼 돌아간다.
 -->
 
  <mx:Button label="{rp.currentItem.label}"  />
 </mx:Repeater>

 <mx:Button label="추가" click="addComponent()" />
 <mx:Button label="삭제" click="removeComponent()" />
 
// 추가 버튼을 누르면 VBOX에 버튼을 생성하여 추가한다.
 <mx:VBox id="vb" width="100%" height="100%" />


1. 우선 추가 버튼을 눌렀을 때 버튼이 생성되게 해보자.

   private var cnt:int;
   private function addComponent():void{
    if(vb.getChildren().length < 5){
     cnt++;
     
     /**
      * 사용자가 추가 버튼을 클릭하면 실행되는 함수.
      * 버튼 객체를 하나 생성하여 속성값을 지정한 다음
      * 이벤트 리스너를 등록하여 준다.
      * vBox에 버튼 객체를 추가한다.
      *
      */
     var btn:Button = new Button();
     btn.label = "동적버튼" + cnt;
     
     /**
      *
      *  flex 이벤트란..? 플렉스 컴포넌트에서 호출되는 이벤트..??
      *  ADD이벤트와 REMOVE이벤트를 등록하여 버튼이 추가되거나 삭제될때
      *  메시지를 보여주기 위해 eventHandler라는 함수를 하나 만든다.
     */
     btn.addEventListener(MouseEvent.CLICK, onClick);
     
     
     btn.addEventListener(FlexEvent.ADD, eventHandler);
     btn.addEventListener(FlexEvent.REMOVE, eventHandler);
     
    // 버튼 생성
     vb.addChild(btn);    
    }else{
     mx.controls.Alert.show("5개 이상은 만드실 수 없습니다!!!!!!!");
    }
   
   }


// 컴포넌트에서 실행된(?) 이벤트를 받아와서 어떤 타입의 이벤트인지 Console창에 출력.
   private function eventHandler(e:FlexEvent):void{
    var btn:Button = e.currentTarget as Button;
    trace(e.type + ":" + btn.label);
   }

private function onClick(e:MouseEvent):void{
    // as 키워드를 이용하여 형변환을 할 수 있다.
    // 아래 소스는 e.currentTarget이라는 객체를 DisplayObject형으로 형변환을 한 것이다.
    // 사용자가 클릭한 currentTarget을 삭제 하는 소스이다.
    var btn:Button = e.currentTarget as Button;
   
    // 이벤트 리스너가 포함된 객체를 remove 하였기 때문에 이벤트 리스너가 더 이상 존재할 필요가 없으므로
    // 해당 이벤트 리스너를 삭제 해 주는 작업이 필요하다
    // 아래 코드는 그런 작업을 해주는 녀석이다-0-
   
    btn.removeEventListener(MouseEvent.CLICK, onClick);
   
    vb.removeChild(e.currentTarget as DisplayObject);
   }
   
   // 부모 노드를 죽일때 자식노드를 모두 없애고 죽이는게 좋다
   // removeAllChildren(); 을 이용하면 된다.
   private function removeComponent():void{
   
    if(vb.getChildren().length <= 0){
     mx.controls.Alert.show("지울 버튼이 없어요!!!!!!");
    }else{
     vb.removeAllChildren();
    }
   }