views:

813

answers:

2

Hi,

I am creating grid based map renderer in AS3 which loads required chunks of PNG images and render them in a container. I've applied scrolling/dragging logic in this app using MOUSE_MOVE event handler. What I do is,

I register bDragging flag in MOUSE_DOWN and position of mouse, In every MOUSE_MOVE, I check displacement of mouse and move main map accordingly Unregister bDragging flag in MOUSE_UP and set position to NaN.

My problem is dragging is quite jerky/shaky.

Any suggestion would be appreciated. following is sample code I'm using.

function onMouseDown(e:MouseEvent):void
{
     m_bDragging = true;
     m_ptPrevPoint = new Point(e.stageX, e.stageY);
}

function onMouseUp(e:MouseEvent):void
{
     m_bDragging = false;
     m_ptPrevPoint = null;
}
function onMouseMove(e:MouseEvent):void
{
    if(!m_bDragging || null == m_ptPrevPoint)
 return;

var nDiffX:Number = int(e.stageX - m_ptPrevPoint.x);
var nDiffY:Number = int(e.stageY - m_ptPrevPoint.y);

//Make movement smoother 
//nDiffX = nDiffX * 4) / 4;
//nDiffY = nDiffY * 4) / 4;

if(nDiffX != 0 || nDiffY != 0)
{
 trace("X : " + nDiffX + ", Y : " + nDiffY + ", points-Old " + m_ptPrevPoint + ", New " + new Point(e.stageX, e.stageY) );
 m_oCircle.x += nDiffX;
 m_oCircle.y += nDiffY;

    m_ptPrevPoint = new Point(e.stageX, e.stageY);

 e.updateAfterEvent();
}
else
 trace("not moved - X : " + nDiffX + ", Y : " + nDiffY+ ", points-Old " + m_ptPrevPoint + ", New " + new Point(e.stageX, e.stageY)) }

Please check FLA file here...made in Flash CS3. Please note if mouse is on circle it will jerk like hell but if you drag it from outside of circle, It will go smoother!

Sample FLA

A: 

Does my answer in this one help?

http://stackoverflow.com/questions/1353361/problems-replicating-drag-and-drop-with-mouse-events/1353489#1353489

Basically, when you move the mouse, the coordinates of the mouse can sometimes be from a different context that expected, depending on the target of the event. You need to translate the coordinates.

Glenn
Hi Glenn, I'm considering stageX and stageY only, so I don't think I should translate coordinates.
Bhavesh.Bagadiya
I don't have CS3 so I can't see the FLA, but you're probably right. If you're sticking to stageX/Y and the circle's coordinates are not scaled vs. the stage, you should be fine in this case.
Glenn
Hey Glenn, Thanks. please see my above comment.
Bhavesh.Bagadiya
A: 

Thanks guys, I figured out the problem!

actually this might be some bug of adobe, I was strangely getting some odd coordinates and that was the reason movement was not smooth. I converted stageX and stageY using localToGlobal and everything became smoother!!!

now, I dont know why should I be needed to convert stageX/stageY to global. :) my brief changes are as below.

var curPt:Point = DisplayObject(e.currentTarget).localToGlobal(new Point(e.stageX, e.stageY));

var nDiffX:Number = int(curPt.x - m_ptPrevPoint.x);

var nDiffY:Number = int(curPt.y - m_ptPrevPoint.y);

Thanks guys, every help appreciated.

Bhavesh.Bagadiya
btw you don't need to cast to an integer: int(curPt.x - m_ptPrevPoint.x)since you assigning it to a number :-)
Allan
Also, it is not a good idea to use MOUSE_MOVE, especially for something as hefty as a map. I would utilize the TIMER class and specify a preferred interval. MOUSE_MOVE is known for being resource hungry.
Brian Hodge