如何使对象跳转到 mousedown 的 cursor/touch 位置？

Question

基于 createjs drag and drop demo，我正在努力使圆跳转到鼠标按下时 cursor/touch 的位置。

我设法使拖动工作，但不知道如何使圆跳转到位置。

createjs.Touch.enable(stage);

this.circle_mc.on("pressmove", function (evt) {
    var point = stage.globalToLocal(evt.stageX, evt.stageY)
    evt.currentTarget.x = point.x;
    evt.currentTarget.y = point.y;
    stage.update();
});

谁能帮它做这样的事情？

更新：设法在动画中使用此代码使其工作：

var _this = this;

stage.on("stagemousedown", function (evt) {
    var point = stage.globalToLocal(evt.stageX, evt.stageY)
    _this.circle_mc.x = point.x;
    _this.circle_mc.y = point.y;

    var moveAround = stage.on("stagemousemove", function (evt) {
        var point = stage.globalToLocal(evt.stageX, evt.stageY)
        _this.circle_mc.x = point.x;
        _this.circle_mc.y = point.y;
    });

    stage.on("stagemouseup", function (evt) {
        stage.off("stagemousemove", moveAround)
    }, null, true)
});

Answer 1

您可以轻松做到这一点，但您必须 re-make 拖动移动，因为默认情况下它需要在对象上按下鼠标才能将其启动。您还必须直接引用目标而不是依赖事件目标。

stage.on("stagemousedown", function(e){
    s.x = e.stageX; s.y = e.stageY;
  
  // Handle move
  var evt = stage.on("stagemousemove", function(e) {
    // Set to mouse position each move
    s.x = e.stageX; s.y = e.stageY;
  });
  
  // Handle release
  stage.on("stagemouseup", function(e) {
    stage.off("stagemousemove", evt)
  }, null, true)
});

这里有一个快速 fiddle 有更好的评论。 https://jsfiddle.net/lannymcnie/fn3gve74/1/

如何使对象跳转到 mousedown 的 cursor/touch 位置？

How to make object jump to cursor/touch position on mousedown?

javascript

html5-canvas

createjs

animate-cc