Question

我的右上角有一个带有图标的画布我想要的是这个：

用户点击图标
用户按住鼠标按钮
用户向左/向右滑动鼠标以使画布向相同方向移动。

这就是让我烦恼的事情......我不希望画布移动直到鼠标移动一定距离（以像素为单位）。然后，一旦鼠标通过那么多像素，项目就需要移动相同数量的像素。

有没有办法找到自点击鼠标以来鼠标移动了多少像素？

Answer 1

我不确定你是否想知道拖放时的绝对位置差异，或者你想记录鼠标行进的距离。

您需要首先对触发所需行为（您的图标）的组件的鼠标按下事件作出反应，并向舞台添加侦听器以通知鼠标移动和鼠标释放。在鼠标释放时，删除侦听器。

简单示例（flex 3）

<mx:Script>
    <![CDATA[

        private var originalX:int;
        private var originalY:int;

        private var diffX:int;
        private var diffY:int;

        private function onBoxClicked(e:MouseEvent):void
        {
            originalX = e.stageX;
            originalY = e.stageY;

            stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMoved);
            stage.addEventListener(MouseEvent.MOUSE_UP, onDragComplete);
        }

        private function onMouseMoved(e:MouseEvent):void
        {

            diffX = e.stageX > originalX ? e.stageX - originalX 
                                         : originalX - e.stageX;

            diffY = e.stageY > originalY ? e.stageY - originalY 
                                         : originalY - e.stageY;

            trace('Mouse moved, cursor has travelled (x:' + diffX + ', y:' + diffY + ')');
        }

        private function onDragComplete(e:MouseEvent):void
        {
            trace('Mouse released, cursor has travelled (x:' + diffX + ', y:' + diffY + ')');
            stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMoved);
            stage.removeEventListener(MouseEvent.MOUSE_UP, onDragComplete);
        }

    ]]>
</mx:Script>

此解决方案的一个问题是，它并不关心鼠标行进的方向，这可能会给您带来一些问题，但您会自己解决这个问题。

Answer 2

On MOUSE_DOWN MouseEvent在MOUSE_MOVE上获取mouseX MouseEvent获取mouseX compair这两个值，你有答案。
如果比较的值大于您想要的数量，请确保使用新的mouseX更新旧鼠标X的日期。

Answer 3

在每次鼠标移动事件中，您都会看到mouseX和mouseY坐标。如果它移动了你想要的数量，你可以调用一个移动你的图标的功能。我在这里错过了什么吗？我认为这不应该太难。

只记录旧鼠标坐标（可以在抛出鼠标点击事件时执行此操作），在移动所需数量时测量新鼠标坐标，然后减去这些值并取绝对值。

Answer 4

我不确定我是否完全理解你，但也许你想要这样的东西：

<?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"
               mouseUp="removeEventListener(MouseEvent.MOUSE_MOVE, foo)">
    <fx:Script>
        <![CDATA[
            private function foo(event:MouseEvent):void
            {
//              if(mouseX == someNumber)... do what you got to do!!!
            }
        ]]>
    </fx:Script>
    <s:Button mouseDown="addEventListener(MouseEvent.MOUSE_MOVE, foo)"/> //Button icon what ever

我很确定你也可以在Flex 3中做类似的事情。

Flex 3：测量点击/保持开始后鼠标移动了多远的方法？

4 个答案: