Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AS3 How to startdrag only on x-axis?

I have a red square that I want to drag only on the x-axis. I've worked out a simple script, which theoretically should work, but it's not behaving properly. It's a bit hard to explain..the square keeps starting at the wrong position and the stage position seems to be changing so sometimes you can't drag the square all the way to the right...

red.buttonMode = true;
red.addEventListener(MouseEvent.MOUSE_DOWN, dragHandler);

function dragHandler(e:MouseEvent):void {
    var ypos:Number = e.currentTarget.y;
    var xpos:Number = e.currentTarget.x;

    e.currentTarget.startDrag(false,new Rectangle(-xpos,ypos,stage.stageWidth,0));
}


red.addEventListener(MouseEvent.MOUSE_UP, dropHandler);

function dropHandler(e:MouseEvent) {
    //trace("red up");
    e.currentTarget.stopDrag();
}
like image 306
muudless Avatar asked Jun 22 '11 01:06

muudless


2 Answers

Glad Marty's solution worked for you, although it is not too efficient (that MouseEvent.MOUSE_MOVE listener is a killer). The problem with your original code was that the rectangle in which you limit the dragging boundaries must be relative to the parent's coordinates. Also, depending on where you have the registration point of your square, you might have to take its width into account, if you don't want any part of it to move out of the stage.

For example, if your red square is directly on the stage, its registration point is located on its centre, and you want to limit the dragging to the whole x-axis of the stage, this will work:

e.currentTarget.startDrag(
       false,
       new Rectangle(
          e.currentTarget.width/2,
          e.currentTarget.y,
          stage.stageWidth-e.currentTarget.width,
          0
       )
);
like image 101
danii Avatar answered Oct 12 '22 22:10

danii


You could try a different approach that incorporates MouseEvent.MOUSE_MOVE, as using a rectangle for a dynamic boundary would be tricky.

// define lock on y-axis
var LOCKY:Number = target.y;

// MouseEvent.MOUSE_MOVE
stage.addEventListener(MouseEvent.MOUSE_MOVE, _mouseMove);
function _mouseMove(e:MouseEvent):void
{
    if(target.y != LOCKY) target.y = LOCKY;
}

// dragging
target.addEventListener(MouseEvent.MOUSE_DOWN, _mouseDown);
function _mouseDown(e:MouseEvent):void
{
    target.startDrag();
    target.addEventListener(MouseEvent.MOUSE_UP, _mouseUp);
}

// dropping
function _mouseUp(e:MouseEvent):void
{
    target.stopDrag();
    target.removeEventListener(MouseEvent.MOUSE_UP, _mouseUp);
}
like image 40
Marty Avatar answered Oct 12 '22 22:10

Marty