用鼠标事件复制拖放的问题 [英] Problems replicating drag-and-drop with mouse events

查看:126
本文介绍了用鼠标事件复制拖放的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想用我自己的例程来复制标准的startDrag / stopDrag事件来改变一些事情,我遇到了一些事件传播或冒泡的问题。这是我的代码:

 <?xml version =1.0encoding =utf-8?> 
mouseDown =mouseDown = truemouseUp =mouseDown = false
mouseMove =mouseMove(event)>

< mx:Script>
<![CDATA [
private var mouseDown:Boolean = false;
private var oldMouseX:int = 0,oldMouseY:int = 0;

private function mouseMove(e:MouseEvent):void {
if(mouseDown){
object.x + =(e.localX - oldMouseX);
object.y + =(e.localY - oldMouseY);
}

oldMouseX = e.localX;
oldMouseY = e.localY;

trace(e.localX);
}
]]>
< / mx:Script>


< / mx:应用程序>

这个代码的问题在于当你拖动对象到右边时,跟踪偶尔有一些随机的localX值到达那里,导致对象从左右摇晃。



我不明白如何修复这部分,我认为它是

>解决方案

跟踪您关注的目标,并直接从中收听事件。所以在你的mousemove函数中,检查e.target ==你的对象。在这种情况下,应用程序。你会得到从子组件冒泡的事件。

  public static function smoothDrag(pressEvent:MouseEvent,dragTarget:DisplayObject = null,done:Function = null,move:Function = null ,parent:DisplayObject = null):void {
var target:DisplayObject = dragTarget;
parent = parent || target.parent;
var eventParent:EventDispatcher = target.stage ||父母;

var moveFunc:Function = move;
var doneFunc:Function = done;

var startPoint:Point = MouseHelpers.pointTo(pressEvent.localX,pressEvent.localY,pressEvent.target as DisplayObject,parent);
startPoint.x - = target.x
startPoint.y - = target.y;

var setPosition:Function = function(e:MouseEvent):void
{
e.stopImmediatePropagation();
var p:Point = MouseHelpers.pointTo(e.localX,e.localY,e.target as DisplayObject,parent);
target.x = p.x - startPoint.x;
target.y = p.y - startPoint.y;

if(moveFunc!= null){
moveFunc();



var stopMove:Function = function(e:MouseEvent):void {
e.stopImmediatePropagation();
eventParent.removeEventListener(MouseEvent.MOUSE_MOVE,setPosition,true);
eventParent.removeEventListener(MouseEvent.MOUSE_UP,stopMove,true);
eventParent.removeEventListener(MouseEvent.ROLL_OVER,EventHelpers.stop,true);
eventParent.removeEventListener(MouseEvent.MOUSE_OVER,EventHelpers.stop,true);

if(doneFunc!= null){
doneFunc(e);


eventParent.addEventListener(MouseEvent.ROLL_OVER,EventHelpers.stop,true,0,true);
eventParent.addEventListener(MouseEvent.MOUSE_OVER,EventHelpers.stop,true,0,true);
eventParent.addEventListener(MouseEvent.MOUSE_MOVE,setPosition,true,0,true);
eventParent.addEventListener(MouseEvent.MOUSE_UP,stopMove,true,0,true);
}


/ **
*将一个点从一个对象的引用转换为另一个引用。当你有一个后代对象x / y,你
*想要获得相对于祖先的那个位置时,最好使用它。使用localToGlobal / globalToLocal样式。
** /
public static function pointTo(fromX:Number,fromY:Number,src:DisplayObject,dest:DisplayObject):Point {
var p:Point = new Point(fromX,fromY );
if(src!= dest){
p = src.localToGlobal(p);
p = dest.globalToLocal(p);
}
return p;
}


I want to replicate the standard startDrag/stopDrag events with my own routine to alter things a bit, and I run into some kind of event propagation or bubbling problem. Here is my code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
                mouseDown="mouseDown = true" mouseUp="mouseDown = false"
                mouseMove="mouseMove(event)">

  <mx:Script>
    <![CDATA[
        private var mouseDown:Boolean = false;
        private var oldMouseX:int = 0, oldMouseY:int = 0;

        private function mouseMove(e:MouseEvent):void {
            if (mouseDown) {
                object.x += (e.localX - oldMouseX);
                object.y += (e.localY - oldMouseY);
            }

            oldMouseX = e.localX;
            oldMouseY = e.localY;

            trace(e.localX);
        }
    ]]>
  </mx:Script>  

  <mx:Label id="object" text="Drag me" />

</mx:Application>

The problem with this code is that as you drag the object to the right, you will see in the trace that occasionally some random localX values arrive there, resulting in the object jerking from side to side.

I don't understand how to fix that part, I do think it's the label which bubbles the mousemove event, but I don't understand how to stop it from doing that.
Any suggestions are greatly appreciated!

解决方案

Track which target you're concerned about and only listen to events directly from it. So in your mousemove function, check e.target == your object. In this case, the application. You will get stray events bubbling from sub components.

    public static function smoothDrag(pressEvent:MouseEvent, dragTarget:DisplayObject = null, done:Function=null, move:Function = null, parent:DisplayObject = null):void {
        var target:DisplayObject = dragTarget;
        parent = parent || target.parent;
        var eventParent:EventDispatcher = target.stage || parent;

        var moveFunc:Function = move;
        var doneFunc:Function = done;

        var startPoint:Point = MouseHelpers.pointTo(pressEvent.localX, pressEvent.localY, pressEvent.target as DisplayObject, parent);
        startPoint.x -= target.x
        startPoint.y -= target.y;

        var setPosition:Function = function(e:MouseEvent):void 
        {
            e.stopImmediatePropagation();
            var p:Point = MouseHelpers.pointTo(e.localX,e.localY, e.target as DisplayObject, parent);
            target.x = p.x - startPoint.x;
            target.y = p.y - startPoint.y;

            if (moveFunc != null) {
                moveFunc();
            }
        }

        var stopMove:Function = function(e:MouseEvent):void {
            e.stopImmediatePropagation();
            eventParent.removeEventListener(MouseEvent.MOUSE_MOVE, setPosition, true);
            eventParent.removeEventListener(MouseEvent.MOUSE_UP, stopMove, true);
            eventParent.removeEventListener(MouseEvent.ROLL_OVER, EventHelpers.stop, true);
            eventParent.removeEventListener(MouseEvent.MOUSE_OVER, EventHelpers.stop, true);

            if (doneFunc != null) {
                doneFunc(e);
            }
        }
        eventParent.addEventListener(MouseEvent.ROLL_OVER, EventHelpers.stop, true, 0, true);
        eventParent.addEventListener(MouseEvent.MOUSE_OVER, EventHelpers.stop, true, 0, true);
        eventParent.addEventListener(MouseEvent.MOUSE_MOVE, setPosition, true, 0, true);
        eventParent.addEventListener(MouseEvent.MOUSE_UP, stopMove, true, 0, true);
    }


    /**
     *  Translate a point from one object's reference into another. Best used when you have a descendant object x/y and you
     *  want to get that position relative to an ancestor. Uses the localToGlobal/globalToLocal style. 
     **/
    public static function pointTo(fromX:Number, fromY:Number, src:DisplayObject, dest:DisplayObject):Point {
        var p:Point = new Point(fromX, fromY);
        if(src != dest) {
            p = src.localToGlobal(p);
            p = dest.globalToLocal(p);
        }
        return p;
    }       

这篇关于用鼠标事件复制拖放的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆