이벤트 문제 (감지되지 않음)

Question

저는 Flex와 ActionScript에 매우 익숙합니다. 패널에 직사각형을 단순히 동적으로 만들 수있는 응용 프로그램을 만들려고합니다. 마우스를 올리면 사각형이 만들어집니다. 마우스 이동 이벤트 (왼쪽 버튼 누르기)에서 업데이트되면 마우스를 위로 올리면 사각형이 완성됩니다.

<?xml version="1.0" encoding="utf-8"?> 
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" 
         width="550" height="400" 
         creationComplete="this.onCreationComplete(event);"> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 
      import mx.controls.Alert; 
      import mx.events.FlexEvent; 
      import mx.graphics.SolidColor; 

      import spark.primitives.Graphic; 
      import spark.primitives.Rect; 

      public static const WIDTH:int = 480; 
      public static const HEIGHT:int = 300; 
      public static const BACKGROUND:int = 0xEFEFEF; 
      public static const CURRENT_FILL:SolidColor = new SolidColor(0x00AA00, 0.75); 

      protected var rectangles:ArrayCollection = null; 

      protected var currentRect:Rect = null; 
      protected var dragging:Boolean = false; 

      protected function onCreationComplete(event:FlexEvent):void 
      { 

       this.rectangles = new ArrayCollection(); 

       this.sprite.graphics.beginFill(BACKGROUND); 
       this.sprite.graphics.drawRect(0, 0, this.sprite.width, this.sprite.height); 
       this.sprite.graphics.endFill(); 

       this.sprite.addEventListener(MouseEvent.MOUSE_DOWN, this.onMouseDown); 
       this.sprite.addEventListener(MouseEvent.MOUSE_UP, this.onMouseUp); 

      } 

      protected function onMouseDown(event:MouseEvent):void 
      { 

       this.currentRect = new Rect(); 
       this.currentRect.y = 10; 
       this.currentRect.height = this.sprite.height - (10 * 2); 

       this.currentRect.x = event.localX; 
       this.currentRect.width = 1; 

       this.panel.addElement(this.currentRect); 

       this.dragging = true; 

       this.sprite.addEventListener(MouseEvent.MOUSE_MOVE, this.onMouseMove); 

      } 

      protected function onMouseUp(event:MouseEvent):void 
      { 
       if (this.dragging) 
       { 

        this.sprite.removeEventListener(MouseEvent.MOUSE_MOVE, this.onMouseMove); 


        this.rectangles.addItem(this.currentRect); 
        this.dragging = false; 

       } 
      } 

      protected function onMouseMove(event:MouseEvent):void 
      { 
       if (this.dragging) 
       { 
        this.currentRect.width = event.localX - this.currentRect.x;  
       } 
      } 

     ]]> 
    </fx:Script> 

    <s:Panel id="panel" x="10" y="10" title="Calendar"> 
     <s:SpriteVisualElement id="sprite" width="{WIDTH}" height="{HEIGHT}" /> 
    </s:Panel> 

</s:WindowedApplication> 

모두 잘 작동하지만 지금은 일부 작업을 수행 할 때 사용자가 클릭 (또는 더블 클릭, 또는 당신이 원하는) 사각형에. 각 사각형 (onMouseUp에 추가 된 this.currentRect.addEventListener (MouseEvent.DOUBLE_CLICK, myMethod))에 이벤트를 추가하려고 시도했지만 해당 메서드가 실행되지 않습니다.

문제점 :

Answer 1

그래픽 API로 그려지는 객체는 이벤트 디스패처가 아닙니다. 따라서 addElement를 사용하여 그래픽 api를 사용하여 모양을 그리는 대신 Spark primitive rect를 만들지 만 어떤 방식 으로든 (예 : 그룹과 같은 컨테이너에) 사용하지 마십시오.

그러나 단순히 ArrayCollection에 묶을 수있는 데이터 객체가 포함되어 있고 itemRenderers와 함께 데이터 그룹을 사용하여 데이터를 표시하는 것이 더 좋습니다.

Answer 2

컬렉션에 그려진 직사각형을 추적하고 마우스 클릭시 직사각형으로 적중 테스트를 수행하고 클릭 한 사각형이 있는지 확인할 수 있습니다.