2016-11-07 70 views
1

基本功能我要爲是...EaselJS:添加子與鼠標按下舞臺上的觸發

點擊(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和新聞的工作是再次點擊相同的雪球。 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); 

        } 
       } 
      } 
     } 

回答

0

pressmove事件是特殊的,因爲它基本上存儲了最後mousedown事件的目標,然後記住它pressmovepressup事件。

這意味着您不能通過強制鼠標事件來僞造事件。從目標分派鼠標事件不會成功。

相反,可以考慮手動處理初始拖動。你已經知道你想成爲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/

我還在演示中添加了一些可能有用的評論。

希望有幫助!

+0

真棒謝謝你!它似乎適用於單獨一個,但我試圖解決多點觸摸(我有一個類似的解決方案,只是去找到所有「balltype」的孩子,並在'stagemouseup'上發佈它們)。 這就是說,一些真正偉大的見解,我在什麼車輪上。再次感謝你! – Shoany