ActionScript 3.0: Event Propagation

I learnt AS3 in a hurry – I had a couple of weeks to get my head around it and get things working – no nicities – just get it working so you can teach it… And what I missed by scrabbling through the ActionScript 3.0 Bible was the propagating nature of the event model. And it’s awesome! You layer things on other things and the event propagates down the tree until it hits the last branch..

In the example below I just create three boxes bound to a Box class, and when adding them to the screen I don’t add them all to the stage – I just add the first one to the stage, add the second one to the first one, and add the last one to the middle one, and just look at MOUSE_OVER and MOUSE_OUT events. Because they’re MovieClips added to MovieClips etc, the event travels down the tree and hits each branch using the current status to work on. Move your mouse over the boxes below to see what I mean:

That’s going to come in really useful… I can just feel it.

Source Code:

Box class:

	import flash.display.MovieClip;
	public class Box extends MovieClip
		public function Box():void
			this.addEventListener(MouseEvent.MOUSE_OVER, isOver);
			this.addEventListener(MouseEvent.MOUSE_OUT, isOut);
		private function isOver(evt:MouseEvent):void
			this.alpha = 0.5;
		private function isOut(evt:MouseEvent):void
			this.alpha = 1;
var topBox:Box = new Box;
topBox.x = 150;
topBox.y = 150;
var middleBox:Box = new Box;
middleBox.x = 100; // Remember this is -RELATIVE- to the MovieClip this MovieClip is being embedded in....
middleBox.y = 100;
var bottomBox:Box = new Box;
bottomBox.x = 100;
bottomBox.y = 100;

ActionScript 3.0: An Introduction to ActionScript 3.0 in Flash CS4

I’m teaching a class on ActionScript 3.0 this year so I’ve been making slides for it, and in the spirit of educational freedom I thought I’d post them up here to see if they’re of use to anyone. The original class I’m taking is Certificate III in Media, CUFDIG302A – Author Interactive Sequences. For those of you unfamiliar with the Australian education system, this means that the course is quite rudimentary, and is aimed at students aged 17 and over.

These slides will not cover the in-depth use of Flash CS4 tools (instead I’ll post a quick Zero-Week primer soon), but will cover some interactive design techniques. Mainly though, they’ll teach you how to use ActionScript 3.0 with Flash CS4 – from the ground up, starting from scratch.

ActionScript 3.0 Slides Week 1 - CUFDIG302A

There’s a download link to the slides along with some legal gubbins regarding their use after the jump, so if you fancy learning ActionScript – you’ll find the knowledge to start from absolute basics right here, and over the coming weeks we’ll ramp up to Symbols, Classes, Events, Object Orientation, Interaction, Sound, Collision Detection and all that other good stuff. We’ll even make a couple of flash games – which should be quite fun :)

Continue reading ActionScript 3.0: An Introduction to ActionScript 3.0 in Flash CS4

ActionScript 3.0 Draw Speed Test: Drawing Primitives Vs. Placing MovieClips

I got a comment about ActionScript 3 the other day which asked a simple and fair question (paraphrased as):

If you’re just using simple shapes like circles, is it faster to draw them to the stage with drawCircle, or to use MovieClips/Sprites to draw them?

Did I know the answer? Um, no… So I knocked up a quick bit of flash to find out. Before you’re given the answer, why not have a quick ponder about what you think will happen? I’ve got to admit, when I did this I got completely the wrong result! Ha! Shows what I know about anything…

Brief analysis plus source-code n’ file after the jump…

Continue reading ActionScript 3.0 Draw Speed Test: Drawing Primitives Vs. Placing MovieClips

ActionScript 3.0: A Dynamic Frame Rate Switching Class to Lower CPU Usage

Flash gets a lot of negative press because it’s seen as using a heap of CPU time and bogging everything down. And it’s a fair cop. Most flash will eat up your CPU cycles even when it’s sitting there doing nothing. But this isn’t a fault of flash, but rather of flash developers. Let me explain…

When you start a piece of flash work, you assign it a frame rate at which you want it to run, so it’ll update the screen, say, 30 times a second. This is all fine and good for when you’re animating things on the stage. But what about when you’re not? Well, it’s still running at 30 frames per second and chewing up your CPU like a crazy melon farmer. This is Not A Good Thing. So, anyhow, I’m watching this video about SWF Framerate Optimisation, and the guy’s showing how you can modify your code to lower the frame rate when there’s not a lot happening, and bring it back up when you’re animating. So I had a crack at it, and lo & behold, it works fine for the specific piece of flash I’d coded it into, so I wondered if I couldn’t just go and make a RateController class. This way, I could add a RateController object to any project to dynamically change the project’s frame rate depending on whether the mouse was over the stage or not.

And after much swearing about not having global access to the stage properties, I found that I COULD!!!

Here’s a working example placed into the attracting particles code I wrote yesterday:

Note: The animation starts at full speed for two seconds on startup. It’ll drop to the sleeping rate (5 fps) two seconds after the mouse leaves the stage, and then ramps back up to its waking rate (30 fps) instantly when the cursor is back over the stage. The FPSCounter shows intermediate numbers because it’s based on an average.

To add a RateController to any flash project, you can just use something like:

import RateController;
// Add a new RateController, uses the root stage, runs at 5fps when sleeping, 30fps 
// when active (i.e. when mouse is over the stage), and uses a 2000 millisecond
// delay after the mouse leaves the stage before dropping the FPS to the sleeping rate.
addChild(new RateController(stage, 5, 30, 2000));

Not bad, eh?

Full class code & file downloads after the jump…

Continue reading ActionScript 3.0: A Dynamic Frame Rate Switching Class to Lower CPU Usage

ActionScript 3.0 Particle Systems #6: Particle Attraction

More ActionScript… This time we’re attracting the particles towards the mouse cursor when the distance between them is low enough… Looks alright, just a kinda fun effect & dead simple to code.

Source code and flash files on the flipside…

Continue reading ActionScript 3.0 Particle Systems #6: Particle Attraction