Date display area
Custom Classes in ActionScript 2
Creating objects in Flash – an overview
Flash has a class-based OOP system which is very similar to that of Java (but note that it is slightly different to that used by Javascript).

In Flash, an object (instance) is created from a recipe (Class file) through the use of the new keyword: -

var MyObject:MyCustomClass = new MyCustomClass();

In ActionScript, a simple class can contain 3 things: -

  • A Constructor function which initialises the instance.
  • Variables or properties which hold each instance’s data.
  • Functions or methods which allow each instance to do things.

Greeter class listing
To use this class, we make a new instance, sending it the greeting we wish it to have, and then get it to display that greeting by calling its showGreeting() function: -
// make new instance var myGreeter:Greeter = new Greeter(“Hello World!”); // get it to display greeting myGreeter.showGreeting();

Example 1 – Following the mouse – a Timer object
In this example, we will make a simple timer object which can cause things to happen at a regular interval. We will use this to move a movieClip instance towards the current mouse position. Since we will only move it part of the way on each update, it will appear to ‘follow’ the mouse, changing direction and speed as it moves.
  1. Make a new movie and create 2 extra layers, naming them scripts, labels, and ball.

  2. Select frame 10 in all of your layers and then choose Blank Keyframe from the Insert menu.

  3. Do the same for frame 20.

  4. Select Frame 1 of the labels layer and then, using the Frame palette, give it the label init.

  5. Select Frame 10 of the labels layer and give that the label main.

  6. Lock the scripts and labels layers. Your timeline should look something like this: -

  7. timeline image
  8. Save your movie as following1.fla in a new project folder.

  9. Choose Insert > New Symbol… and then choose movieClip.

  10. Create a simple ball shape which will follow your mouse around.

  11. When you have done, return to the main timeline.

  12. Pick up your new symbol in the Library and drag it onto the stage to create an instance.

  13. Name your instance ball1_mc.

  14. Choose New from the file menu and then select ActionScript File. This opens a new .as external script file – the only place you are allowed to create classes.

  15. Carefully type the following: -
  16. class Timer { // a basic class to carry out periodic checking private var timer:Number; // this object's timer reference private var interval:Number; // how often action is checked (in milliseconds) private var target:Object; // the movie clip to notify - should have an update() function // the constructor function public function Timer(interval:Number, myTarget:Object){ this.interval = interval; // store the interval this.timer = null; // no timer yet this.target = myTarget; // store the movie clip reference } // starts the timer going public function startTimer():Void{ if(this.timer==null){ this.timer = setInterval(this,"checkTask",this.interval); } } // stops the timer straight away public function stopTimer():Void{ if(this.timer!=null){ clearInterval(this.timer); this.timer=null; } } // the function that is checked private function checkTask():Void{ // call the target's update() function this.target.update(); } }

  17. Save the file as Timer.as in the same folder that the flash Movie is in. Make sure the file name is exactly the same as the Class name.

  18. Select the frame actions for frame 10 of the scripts layer. Edit the script so it is as follows: -
  19. // script for main // make a new timer // make it check 30 times a second // and call ball1_mc's update function var timer1:Timer = new Timer(33,this.ball1_mc); // give an update function to the ball this.ball1_mc.update = function(){ // find how far away the mouse is var xdif = _root._xmouse - this._x; var ydif = _root._ymouse - this._y; // move ball a tenth of the way toward mouse this._x += (xdif/10); this._y += (ydif/10); }; // start the timer timer1.startTimer(); // hold the movie here stop();

  20. Check your code syntax and close the Actions pane. Your movie is finished.

  21. Test it by pressing the CONTROL and ENTER keys together.
Further developments
Fading in a movieClip
Try editing the update function so that instead of moving the ball, when the mouse goes over the ball, the timer is started and the update function gradually increases the _alpha property of the ball clip - and then stops the timer (by calling the stopTimer() function) when it reaches 100.

Fading out when the mouse leaves
Try amending your fade-in example so that when the mouse leaves the ball, it is faded out again.

Changing the size of a movieClip
A common Flash effect is for the instance to grow when the mouse goes over it and then shrink back when the mouse leaves. This is particularly effective when a (large) number of shapes are on stage. Each one will need its own Timer instance (hint – try using a loop to set up several instances automatically).


This page was last updated on 12th January 2009