どのようにしてボックスの1つを削除することができますか？

Question

このコードは数分で動作しますが、突然エラー＃2032が発生します。私はちょうどAC3を学び始めているし、明らかに何か間違っている。誰かが私を助けて説明することができますか？

<fx:Script> 

    <![CDATA[ 
     import mx.containers.Canvas; 
     import mx.containers.Panel; 
     import mx.events.FlexEvent; 
     import mx.events.FlexMouseEvent; 

     import spark.components.Button; 


     public function createBoxes():void 
     { 

      //create a Panel 
      var colorsPanel:Panel = new Panel(); colorsPanel.layout = "absolute"; colorsPanel.width = 250; colorsPanel.height = 250; 
      //add the Panel to the Application 
      addElement(colorsPanel); 
      //create a red box 
      var redBox:Canvas = new Canvas(); redBox.x = 70; redBox.y = 70; redBox.width = 50; redBox.height = 50; redBox.setStyle("backgroundColor", 0xFF0000); 
      //create a green box 
      var greenBox:Canvas = new Canvas(); greenBox.x = 90; greenBox.y = 90; greenBox.width = 50; greenBox.height = 50; greenBox.setStyle("backgroundColor", 0x00FF00); 
      //create a blue box 
      var blueBox:Canvas = new Canvas(); blueBox.x = 100; blueBox.y = 60; blueBox.width = 50; blueBox.height = 50; blueBox.setStyle("backgroundColor", 0x0000FF); 
      //add the boxes to the Panel 
      var Button:spark.components.Button = new spark.components.Button(); Button.x = 80; Button.y =160; Button.label ="removeG"; 
      colorsPanel.addElement(redBox); 
      colorsPanel.addElement(greenBox); 
      colorsPanel.addElement(blueBox); 
      colorsPanel.addElement(Button); 
      Button.addEventListener(MouseEvent.CLICK,removeBox); 

     } 

    public function removeBox(evt:MouseEvent):void 
    { 

    } 

    ]]> 
</fx:Script> 
<s:Button id="But1" x="45" y="40" label="Click" click="createBoxes()"/> 

Answer 1

のようなうんサムを使用すると、イベントリスナーを追加するためのボタンのインスタンスを使用する必要があると述べています。

 <![CDATA[ 
      import mx.containers.Canvas; 
      import mx.containers.Panel; 
      import mx.events.FlexEvent; 
      import mx.events.FlexMouseEvent; 

      import spark.components.Button; 

      private var buttonToPanelMap:Object={}; 

    public function createBoxes():void 
    { 

     //create a Panel 
     var colorsPanel:Panel = new Panel(); 
     colorsPanel.layout = "absolute"; 
     colorsPanel.width = 250; 
     colorsPanel.height = 250; 
     //add the Panel to the Application 
     addElement(colorsPanel); 

     //create a red box 
     var redBox:Canvas = new Canvas(); 
     redBox.x = 70; 
     redBox.y = 70; 
     redBox.width = 50; 
     redBox.height = 50; 
     redBox.setStyle("backgroundColor", 0xFF0000); 

     //create a green box 
     var greenBox:Canvas = new Canvas(); 
     greenBox.x = 90; 
     greenBox.y = 90; 
     greenBox.width = 50; 
     greenBox.height = 50; 
     greenBox.setStyle("backgroundColor", 0x00FF00); 

     //create a blue box 
     var blueBox:Canvas = new Canvas(); 
     blueBox.x = 100; 
     blueBox.y = 60; 
     blueBox.width = 50; 
     blueBox.height = 50; 
     blueBox.setStyle("backgroundColor", 0x0000FF); 

     //add the boxes to the Panel 
     colorsPanel.addElement(redBox); 
     colorsPanel.addElement(greenBox); 
     colorsPanel.addElement(blueBox); 

     var boxRemoverBtn:Button = new Button(); 
     boxRemoverBtn.x = 80; 
     boxRemoverBtn.y =160; 
     boxRemoverBtn.label ="removeG"; 
     colorsPanel.addElement(boxRemoverBtn); 
     boxRemoverBtn.addEventListener(MouseEvent.CLICK,removeBox); 
     buttonToPanelMap[boxRemoverBtn] = colorsPanel; 

    } 

    public function removeBox(evt:MouseEvent):void 
    { 
     removeElement(buttonToPanelMap[evt.target] as Panel); 
    } 

     ]]> 
    </fx:Script> 
    <s:Button id="But1" x="45" y="40" label="Click" click="createBoxes()"/>