Category Archives: motion

Draw Spiral

By Zevan | December 8, 2008
CLICK HERE TO COPY
Actionscript:
  1. stage.frameRate = 30;
  2. var xp:Number = 0;
  3. var yp:Number = 0;
  4. var counter:Number = 0;
  5. graphics.lineStyle(0,0x999999);
  6. graphics.moveTo(200,200);
  7. addEventListener(Event.ENTER_FRAME, onLoop);
  8. function onLoop(evt:Event):void {
  9.     for (var i:int = 0; i <20; i++) {
  10.         counter += .05;
  11.         xp=200 + counter * Math.cos(counter);
  12.         yp=200 + counter * Math.sin(counter);
  13.         graphics.lineTo(xp, yp);
  14.     }
  15.     if (counter> 400) {
  16.         removeEventListener(Event.ENTER_FRAME, onLoop);
  17.     }
  18. }

Draws a spiral over time.

Also posted in Graphics | Tagged , , | Leave a comment

Random Walk

By Zevan | December 6, 2008
CLICK HERE TO COPY
Actionscript:
  1. var xp:Number=Math.random() * stage.stageWidth;
  2. var yp:Number=Math.random() * stage.stageHeight;
  3. graphics.lineStyle(0,0x000000);
  4. graphics.moveTo(xp, yp);
  5. addEventListener(Event.ENTER_FRAME, onLoop);
  6. function onLoop(evt:Event):void {
  7.     xp+=Math.random()*10-5;
  8.     yp+=Math.random()*10-5;
  9.     graphics.lineTo(xp, yp);
  10. }

Nothing special here, but its good to know that this technique has a name... and that it's NOT Brownian Motion... more here.

Also posted in Graphics | Tagged , , | Leave a comment

Simple Particles

By Zevan | November 25, 2008
CLICK HERE TO COPY
Actionscript:
  1. stage.frameRate = 30;
  2. addEventListener(Event.ENTER_FRAME, onLoop);
  3. function onLoop(evt:Event):void{
  4.     if (int(Math.random()*5)==1){
  5.       for (var i:int= 0; i<10; i++) createParticle();
  6.     }
  7. }
  8.  
  9. function createParticle():void{
  10.     var s:MovieClip = new MovieClip();
  11.     s.graphics.beginFill(0);
  12.     s.graphics.drawCircle(0,0,Math.random()*10 + 2);
  13.     s.velX = Math.random()*10-5
  14.     s.velY =  Math.random()*10-5
  15.     s.posX = s.x = 200;
  16.     s.posY = s.y = 200;
  17.     addChild(s);
  18.     s.addEventListener(Event.ENTER_FRAME, onRunParticle);
  19. }
  20.  
  21. function onRunParticle(evt:Event):void {
  22.     var s:MovieClip = MovieClip(evt.currentTarget);
  23.     s.posX += s.velX;
  24.     s.posY += s.velY;
  25.     s.scaleX = s.scaleY -=  .04;
  26.     if (s.scaleX <0){
  27.         removeChild(s);
  28.         s.removeEventListener(Event.ENTER_FRAME, onRunParticle);
  29.     }
  30.     s.x = s.posX;
  31.     s.y = s.posY;
  32. }

Nothing special here. But my students are always asking me about this - in class I have them alter this code to make fire, water and abstract particle systems.

Also posted in random | Tagged , , , | 6 Comments

10,000 Transparent Sprites

By Zevan | November 21, 2008
CLICK HERE TO COPY
Actionscript:
  1. stage.frameRate = 30;
  2.  
  3. var imageNum:int = 10000;
  4. var point:Point = new Point(0,0);
  5. var s:Sprite = new Sprite();
  6. s.graphics.beginFill(0xCCCCCC);
  7. s.graphics.lineStyle(0,0x000000);
  8. s.graphics.drawCircle(3,3,3);
  9. s.alpha = .1;
  10.  
  11. var nested:Sprite = new Sprite();
  12. nested.addChild(s);
  13. var image:BitmapData = new BitmapData(s.width, s.height, true, 0x00000000);
  14. image.draw(nested);
  15.  
  16. var canvas:BitmapData = new BitmapData(400,400, true, 0xFFFFFFFF);
  17. addChild(new Bitmap(canvas));
  18.  
  19. var xPos:Array = new Array();
  20. var yPos:Array = new Array();
  21. for (var i:int = 0; i<imageNum; i++) {
  22.     xPos.push(Math.random()*400);
  23.     yPos.push(Math.random()*400);
  24. }
  25.  
  26. addEventListener(Event.ENTER_FRAME, onLoop);
  27. function onLoop(evt:Event):void {
  28.     canvas.fillRect(new Rectangle(0,0,400,400), 0xFFFFFFFF);
  29.     var div:Number;
  30.     for (var i:int = 0; i<imageNum; i++) {
  31.         div  = (i / 100)+2;
  32.         xPos[i] += (mouseX - xPos[i])/div;
  33.         yPos[i] += (mouseY - yPos[i])/div;
  34.         point.x = xPos[i];
  35.         point.y = yPos[i];
  36.         canvas.copyPixels(image, image.rect, point, null, null, true);
  37.     }
  38. }

This is from my other blog but I figured it was worth posting here. It draws 10'000 transparent circles that each follow the mouse at different speeds. This is achieved using copyPixels().

Also posted in BitmapData | Tagged , , | 2 Comments