Question

只有当我与组件的可见部分进行交互时，如何才能使Flex调度鼠标事件？在这种情况下，我希望仅在悬停线路时调度事件。

<s:Group mouseOver="trace('over')">
    <s:Line xFrom="0" yFrom="0" xTo="100" yTo="100">
         <s:stroke>
             <s:SolidColorStroke color="0" weight="3"/>
         </s:stroke>
    </s:Line>
</s:Group>

我记得前一段时间我在Flex 3中遇到了一个问题，当我用透明背景填充画布时我无法捕捉鼠标事件。但现在我遇到了相反的问题。谢谢你的帮助。

Answer 1

你走在正确的轨道上。

正如您已经完成的那样，您需要将Line对象包装在Group或其他容器类中，因为Spark图形基元（如Line）不会发送鼠标事件。

我认为你的问题是因为你的线是对角线的，Group的边界框是一个比直线大得多的矩形。

如果您绘制水平或垂直线，Group的边界框应该只是Line的尺寸。然后旋转Group以获得对角线：

注意，我刚刚选择了一个随机的X值，并且旋转......旋转具有移动对象的X / Y坐标的效果......除非你使用BasicLayout之外的其他东西。因此，您必须调整x / y /旋转（和/或布局）以将线定位在正确的位置。

<s:Group mouseOver="trace('over')" rotation="45">
    <s:Line x="100" yFrom="0" yTo="100">
        <s:stroke>
            <s:SolidColorStroke color="0" weight="3"/>
        </s:stroke>
    </s:Line>
</s:Group>

Answer 2

您可以尝试以下代码： -

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;

            private function rollOver(event:MouseEvent):void
            {
                Alert.show('over');
            }

            private function drawLine():void
            {
                var g:Graphics = graphics;

                graphComp.graphics.clear();
                var strokeColor:Number = getStyle("strokeColor");
                var shadowColor:Number = getStyle("shadowColor");

                graphComp.graphics.beginFill(strokeColor);
                graphComp.graphics.drawRect(0, 0, 100, 1);
                graphComp.graphics.endFill();

                graphComp.graphics.beginFill(shadowColor);
                graphComp.graphics.drawRect(0, 1, 100, 1);
                graphComp.graphics.endFill();
                graphComp.rotation = 45;

            }
        ]]>
    </fx:Script>
    <s:Group id="graphComp" x="100" y="100" creationComplete="drawLine()" rollOver="rollOver(event)"/>

</s:Application>

鼠标事件仅在可见部分上

2 个答案: