EaselJS：添加触发 mousedown 的子项

Question

我要实现的基本功能是......

在舞台上点击 (mousedown) 以在该位置创建并添加一个孩子。

*编辑：我也在尝试解决多点触控，因此可以同时创建多个球。

当您按住时，您可以拖动（按下移动）该子项，它会不断增长（使用 regX/regY/scaleX/scaleY），直到您释放 (pressup)，然后它会下降（使用滴答循环）。

我的一切都在工作，但我遇到了一个障碍，我无法添加一个孩子并让它立即注册 mousedown 而无需再次释放和按下。

有没有办法在添加后手动触发mousedown，或者其他更有意义的解决方法？ dispatchEvent 似乎不起作用。

这是我的舞台事件监听器和触摸位：

            stage.enableMouseOver(10);
            createjs.Touch.enable(stage, false, false);
            stage.preventSelection = false;
            stage.addEventListener("stagemousedown", spawnsnowball);

这是我的功能。 spawnsnowball 之一包括displayObject 事件侦听器濒临绝望，但我能够让 pressmove 和 pressup 工作的唯一方法是再次单击同一个雪球。 releasesnowball 现在只是释放它们的所有实例（使用 'stagemouseup' 侦听器），但如果我可以让它从 pressup 触发，那么我将重写它以仅针对事件目标。

        function spawnsnowball(evt){
            var ball = new createjs.Bitmap(loader.getResult("snowball"));
            ball.crossOrigin="Anonymous";
            ball.name="ball";
            ball.scaleX = 0.5;
            ball.scaleY = ball.scaleX;
            ball.regX = ball.image.width/2;
            ball.regY = ball.image.height/2;
            ball.x = evt.stageX;
            ball.y = evt.stageY;

            ball.type = balltype;

            ball.holding = 1;
            ball.velX = 0;
            ball.velY = 0;
            ball.addEventListener("pressup",releasesnowball);
            ball.addEventListener("pressmove",dragsnowball);
            ball.onPress = function(mouseEvent) {};
            stage.addChild(ball);
            ball.dispatchEvent("mousedown");
            ball.dispatchEvent("pressdown");

        }

        function dragsnowball(evt){
            evt.target.x = evt.stageX;
            evt.target.y = evt.stageY;
        }

        function releasesnowball(evt){
            for(var i=0;i<stage.getNumChildren();i++){
                var shape = stage.getChildAt(i);
                if(shape.type == balltype){
                    if(shape.holding){
                        shape.holding = 0;
                        var dX = shape.x - shape.oldX;
                        var dY = shape.y - shape.oldY;
                        if(Math.abs(dY)>8)
                            dY = 8*dY/Math.abs(dY);
                        if(Math.abs(dX)>3)
                            dX = 3*dX/Math.abs(dX);

                     }
                }
            }
        }

Answer 1

pressmove 事件很特别，因为它基本上存储了最后一个mousedown 事件的目标，然后为pressmove 和pressup 事件记住它。

这意味着您不能通过强制鼠标事件来真正伪造事件。从目标分派鼠标事件将无法解决问题。

相反，请考虑手动处理初始拖动。您已经知道要成为 pressmove 的目标，因此您可以监听 stagemousemove 事件，并自己处理：

// Listen to the stagemousemove and manually call the event.
  var initialDrag = stage.on("stagemousemove", function(event) {
    event.target = ball; // Re-target the event so your other method works fine.
    dragsnowball(event);
  });

// When done, remove the move listener.
// The off() method supports a "once" parameter so you don't have to unsubscribe that listener.
  stage.on("stagemouseup", function(event) {
    stage.off("stagemousemove", initialDrag);
  }, null, true); // Fires one time

以下是使用您的代码作为基础的快速示例：http://jsfiddle.net/3qhmur82/

我还在演示中添加了一些可能有用的 cmets。

希望有帮助！