easeljs学习笔记事件_个人生物教学资源网

easeljs学习笔记事件

添加事件方法
function init() {

//find canvas and load images, wait for last image to load

var canvas = document.getElementById("testCanvas");

var stage = new createjs.Stage(canvas);

// Create a new Text object and a rectangle Shape object, and position them inside a container:

var container = new createjs.Container();

container.x = 100;

container.y = 80;

var target = new createjs.Shape();

target.graphics.beginFill("#F00").drawRect(-10, -10, 300, 60).beginFill("#FFF");

container.addChild(target);

var txt = new createjs.Text("Double Click Me!", "36px Arial", "#FFF");

txt.textBaseline = "top";

container.addChild(txt);

stage.addChild(container);

container.on("dblclick", function (evt) {

alert("Double Clicked the container object");

});

stage.update();

}
--------------------------------------------------------------------------------------------------------------------

var canvas, stage;

var drawingCanvas;

var oldPt;

var oldMidPt;

var title;

var color;

var stroke;

var colors;

var index;

function init() {

canvas = document.getElementById("myCanvas");

index = 0;

colors = ["#828b20", "#b0ac31", "#cbc53d", "#fad779", "#f9e4ad", "#faf2db", "#563512", "#9b4a0b", "#d36600", "#fe8a00", "#f9a71f"];

//check to see if we are running in a browser with touch support

stage = new createjs.Stage(canvas);

stage.autoClear = false;

stage.enableDOMEvents(true);

createjs.Touch.enable(stage);

createjs.Ticker.setFPS(24);

drawingCanvas = new createjs.Shape();

stage.addEventListener("stagemousedown", handleMouseDown);

stage.addEventListener("stagemouseup", handleMouseUp);

title = new createjs.Text("Click and Drag to draw", "36px Arial", "#777777");

title.x = 300;

title.y = 200;

stage.addChild(title);

stage.addChild(drawingCanvas);

stage.update();

}

function handleMouseDown(event) {

if (!event.primary) { return; }

if (stage.contains(title)) {

stage.clear();

stage.removeChild(title);

}

color = colors[(index++) % colors.length];

stroke = Math.random() * 30 + 10 | 0;

oldPt = new createjs.Point(stage.mouseX, stage.mouseY);

oldMidPt = oldPt.clone();

stage.addEventListener("stagemousemove", handleMouseMove);

}

function handleMouseMove(event) {

if (!event.primary) { return; }

var midPt = new createjs.Point(oldPt.x + stage.mouseX >> 1, oldPt.y + stage.mouseY >> 1);

drawingCanvas.graphics.clear().setStrokeStyle(stroke, 'round', 'round').beginStroke(color).moveTo(midPt.x, midPt.y).curveTo(oldPt.x, oldPt.y, oldMidPt.x, oldMidPt.y);

oldPt.x = stage.mouseX;

oldPt.y = stage.mouseY;

oldMidPt.x = midPt.x;

oldMidPt.y = midPt.y;

stage.update();

}

function handleMouseUp(event) {

if (!event.primary) { return; }

stage.removeEventListener("stagemousemove", handleMouseMove);

}

</script>

----------------------------------------------------------------------------------------------------------------
bitmap.addEventListener("pressmove", function (evt) {
var o = evt.target;
o.x = evt.stageX + o.offset.x;
o.y = evt.stageY + o.offset.y;
// indicate that the stage should be updated on the next tick:
update = true;
});

easeljs学习笔记 事件

easeljs学习笔记事件