代码示例1：通过addEventListener添加事件
注意需要给stage启用Touch enable.
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="js/easeljs.min.js"></script>
<title>dragtest</title>
</head>
<body>
<canvas id="dragCanvas" width="600" height="400" style="border:1px solid #000"></canvas>
<script>
var stage=new createjs.Stage("dragCanvas");
createjs.Touch.enable(stage);
createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick",handleTicker);
function handleTicker(){
stage.update();
}
var image=new createjs.Bitmap("images/b.png");
stage.addChild(image);
var oldX;
var oldY;
image.addEventListener("mousedown",function(e){
console.log('mousedown');
oldX= e.stageX;
oldY= e.stageY;
});
image.addEventListener("pressmove", function (e) {
console.log('move');
e.target.x+= e.stageX-oldX;
e.target.y+= e.stageY-oldY;
oldX= e.stageX;
oldY= e.stageY;
});
</script>
</body>
</html>代码示例2 通过on设定事件
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="js/easeljs.min.js"></script>
<title>dragtest</title>
</head>
<body>
<canvas id="dragCanvas" width="600" height="400" style="border:1px solid #000"></canvas>
<script>
var stage=new createjs.Stage("dragCanvas");
createjs.Touch.enable(stage);
createjs.Ticker.setFPS(30);
createjs.Ticker.addEventListener("tick",handleTicker);
function handleTicker(){
stage.update();
}
var image=new createjs.Bitmap("images/b.png");
image.regX = 90;
image.regY = 90;
image.x=90;
image.y=90;
stage.addChild(image);
image.on("pressmove",dragmove);
function dragmove(evt){
//stage.addChild(evt.target); 这句暂时不知道有什么作用
evt.target.x = evt.stageX;
evt.target.y = evt.stageY;
}
</script>
</body>
</html>
