Drag and drop smoothly Animate CC Canvas

[aidans35222432]

I am using Animate CC, Canvas, I'm trying to drag my background scene along the X axis, the code I have so far is

this.scene.addEventListener("pressmove", dragMe.bind(this));  function dragMe (evt) { this.addChild(evt.currentTarget); var p = this.globalToLocal(evt.stageX, evt.stageY); evt.currentTarget.x = p.x; }

However each time I drag the background it snaps the image to the mouse (depending on where the axis - rotation point - is placed in Animate CC). This makes for an unsmooth drag, I would like something more like a touch screen interaction where I can just keep dragging/swiping it along.

I can't seem to find a solution anywhere for this.

Thanks in advance.

[Joseph Labrecque · Accepted solution]

Yes - by default, the x and y are calculated from teh registration point.

Have a look at the following example as it seems to accomplish what you are looking to do:

Draggable Canvas - JSFiddle

[aidans35222432]

Wow! Yes!!! This is exactly what I was looking for, that's perfect thanks! I knew there had to be a way.

[aidans35222432]

Hi,

Please excuse my ignorance, I really am just starting to learn all this.

Within Animate CC I can't seem to find a way to give the canvas an id, so the code can't reference anything and therefore the drag doesn't work (or at least I assume that's the issue).

Have you any idea how to make this work in Animate CC or am I just making my life complicated?

Thanks again

[ClayUUID]

The canvas is given the ID "canvas".