Actionscript:
-
stage.frameRate = 30;
-
var pencil:Shape = new Shape();
-
addChild(pencil);
-
-
var index:int = 0;
-
var points:Array = new Array();
-
var circle:Shape = new Shape();
-
circle.graphics.beginFill(0x000000);
-
circle.graphics.drawCircle(0,0, 5);
-
addChild(circle);
-
-
stage.addEventListener(MouseEvent.MOUSE_DOWN, onDown);
-
stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
-
-
circle.addEventListener(Event.ENTER_FRAME, onMoveCircle);
-
-
function onDown(evt:MouseEvent):void {
-
pencil.graphics.lineStyle(0,0x000000);
-
pencil.graphics.moveTo(mouseX, mouseY);
-
stage.addEventListener(MouseEvent.MOUSE_MOVE, onDraw);
-
}
-
-
function onUp(evt:MouseEvent):void {
-
stage.removeEventListener(MouseEvent.MOUSE_MOVE, onDraw);
-
}
-
-
function onDraw(evt:Event):void {
-
pencil.graphics.lineTo(mouseX, mouseY);
-
points.push(new Point(mouseX, mouseY));
-
}
-
-
function onMoveCircle(evt:Event):void {
-
if (points.length>0) {
-
circle.x += (points[index].x - circle.x) / 4;
-
circle.y += (points[index].y - circle.y) / 4;
-
index++;
-
if (index==points.length) {
-
index=0;
-
}
-
}
-
}
Wrote this in response to a student question. It causes a circle shape to animate along lines drawn by the user.
2 Comments
Thank you. What a great post!
Is there a way to detect “sudden moves”, let’s say when a circle jumps some minimum distance from one path to another? I thought it would be cool to add some kind of event when it happens to make the animation more dramatic.
Thanks Vlad. Yeah there is… the next post I wrote after this one is actually about Mouse Velocity… it compares the mouseX and mouseY from the previous enterFrame to the mouseX and mouseY on the current enterFrame… if a sudden movement occurs the x and y differences will be greater… check out this post.