如何在Flex中爲自定義組件編寫事件？

Question

我寫了一個用於在Flex中繪製圓的自定義組件。但是當我嘗試爲該組件編寫單擊事件或mouseDown事件時，它不起作用。

我有一個VBox內的圓形組件。

<mx:VBox label="Currents Quote" width="100%" backgroundColor="#DDDDDD"> 

<comp:MyCircle id="circlle" x1="175" y1="150" 
        radius="140" click='{Alert.show("Hello");}' 
        mouseDown="handleMouseDown(event);"/> 
<comp:MyLine x1="175" y1="104"/> 
</mx:VBox> 

    private function handleMouseDown(event:MouseEvent):void { 

     var pt:Point = new Point(event.localX, event.localY); 
     pt = event.target.localToGlobal(pt); 
     pt = circlle.globalToContent(pt); 
     var whichColor:String = "border area"; 

     if (pt.x < 150) { 
      if (pt.y < 150) 
       whichColor = "red"; 
      else 
       whichColor = "blue"; 
     } 
     else { 
      if (pt.y < 150) 
       whichColor = "green"; 
      else 
       whichColor = "magenta"; 
     } 

     Alert.show("You clicked on the " + whichColor); 
     } 

圈部件：

package components 
    { 
import mx.core.UIComponent; 

public class MyCircle extends UIComponent 
{ 
     public var x1:int; 
      public var y1:int; 
      public var radius:int; 

      override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
     { 
     graphics.lineStyle(1, 0x000000); 
     graphics.drawCircle(x1, y1, radius); 

     graphics.lineStyle(1, 0x000000); 
     graphics.drawCircle(x1, y1, radius-40); 

     graphics.lineStyle(1, 0x000000); 
     graphics.drawCircle(x1, y1, radius-100); 
     } 
    } 
} 

的「你好」警報僅在特定點顯示，並猜測是，在點（175150）與x，圓的y座標。但是不應該在我點擊MyCircle組件時顯示它？如何以這種方式啓用它？

此外，mouseDown函數不適用於MyCircle，但如果VBox具有該事件，則會顯示警報。爲什麼這樣？有人可以指導我嗎？

我應該以不同的方式爲自定義組件寫入事件嗎？

Answer 1

我不確定這是否適用，但有一個錯誤，其中一些UIComponents無法正確識別click/mouseDown事件，除非它們具有背景顏色。看看爲您的圈子添加背景顏色是否有幫助。

Answer 2

您的代碼中也存在一些錯誤，例如，您的actionscript缺少腳本標記，您可能需要導入Alert。

<mx:VBox label="Currents Quote" width="100%" backgroundColor="#DDDDDD"> 

<comp:MyCircle id="circlle" x1="175" y1="150" 
        radius="140" click='{Alert.show("Hello");}' 
        mouseDown="handleMouseDown(event);"/> 
<comp:MyLine x1="175" y1="104"/> 
</mx:VBox> 

<mx:Script> 
<![CDATA[ 
    private function handleMouseDown(event:MouseEvent):void { 

     var pt:Point = new Point(event.localX, event.localY); 
     pt = event.target.localToGlobal(pt); 
     pt = circlle.globalToContent(pt); 
     var whichColor:String = "border area"; 

     if (pt.x < 150) { 
      if (pt.y < 150) 
       whichColor = "red"; 
      else 
       whichColor = "blue"; 
     } 
     else { 
      if (pt.y < 150) 
       whichColor = "green"; 
      else 
       whichColor = "magenta"; 
     } 

     Alert.show("You clicked on the " + whichColor); 
     } 
]]> 
</mx:Script>