事件问题（未检测到）

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>

一切正常，但现在我想在用户单击（或双击，或您想要的）矩形时执行一些操作。我试图在每个矩形上添加一个事件（this.currentRect.addEventListener(MouseEvent.DOUBLE_CLICK, myMethod) 在onMouseUp中添加），但是对应的方法永远不会执行...

有什么问题？

Answer 1

使用图形 API 绘制的对象不是事件调度器。因此，请使用 addElement 添加您正在创建但未以任何方式使用的 Spark 原始矩形（添加到诸如 Group 之类的容器中），而不是使用图形 api 来绘制形状。

不过，您可能会发现让 ArrayCollection 包含一堆可绑定的数据对象并使用带有 itemRenderers 的 DataGroup 来显示数据会更好。

Answer 2

您可以跟踪您在集合中绘制的矩形，并在鼠标单击时对矩形进行命中测试，并确定是否单击了任何矩形。