Classes and Movie Clips - Page 3
       by kirupa  |  28 May 2007

In the previous page, you created your BlueCircle.as file and copied and pasted some code. When you tested your movie, you noticed that the blue circle you had on your stage was now moving in a circular path. In this page, let's look at the code and figure out what all of the code you pasted does.

Examining the Code
Let's look at each line of our code in BlueCircle.as in detail:

package {
 
..
..
..
 
}

The very first line of code in BlueCircle.as is our package declaration. If you are familiar with packages in other languages such as Java or namespaces in .NET, this should be very familiar to you.

In a nutshell, a package is like a folder under which all of your classes can be referenced through. I am not going to dwell too much on packages in this tutorial, for I plan on covering them in greater detail later. In this case, I am not specifying a package name, so specifying them is more of a formality than something that you need to consciously keep in mind when writing your code.

Let's move on:


import flash.display.*;
import flash.events.*;

The above two lines are import statements. In ActionScript 3, whenever you need to use functionality found in built-in classes, you will need to reference the path to the classes via import statements. For example, you will soon find that I use the enterframe event to create my animation. Unless I actually import the various event-related classes as shown above, the compiler will have no idea what an enterframe event actually is.


public class BlueCircle extends MovieClip {
..
..
..
}

This line is probably the most important line in this application. Here, I define my BlueCircle class. If you recall, when you created your circle movie clip earlier, you specified the name of the class:

With the above line of code, you create the magical link between your movie clip in your Library and the BlueCircle class you just created.

There is another important thing to note about our BlueCircle class definition. I am using the extends keyword to let the compiler know that BlueCircle is basing a lot of its functionality from the MovieClip class. This is important because, like you see in the above screenshot, the base class for our movie clip is flash.display.MovieClip.

So, why am I not writing BlueCircle extends flash.display.MovieClip? If you check a few lines earlier, you already imported flash.display.*, and the * wildcard allows you to get away with using any class stored inside flash.display without fully specifying its name. That is why I simply write extends MovieClip as opposed to the longer variant I just asked about.


var radians = 0;
var speed = 0;
var radius = 5;

The first five lines inside our BlueCircle class are pretty straightforward. I am declaring five variables that I will be using, and the radians, speed, and radius variables are initialized to some default values. I wish I had more to say about them, but I don't, let's move on :-P


public function BlueCircle()
{
..
..
..
}

If the class definition was the most important line of code in this movie, then our BlueCircle constructor shown here would be the second most important line of code. A constructor is the name for a method that gets called whenever you create new instances of a class. That probably made no sense, let's kick it down a few notches.

Each time you drag and drop a new circle movie clip from your library, you are basically creating a new user of of your BlueCircle class. A user of a class is known as an instance. Whenever you create a new instance by inserting another circle movie clip into your stage, a method whose name is the same as that of your class gets called. That method is known as a constructor. That is what you see above.

Notice that our class is called BlueCircle, and our constructor's name is also called BlueCircle. With the exception of it being called when an instance is created, a constructor is largely the same as any regular method. For you long-time AS programmers, feel free to add functionality in your constructor that you used to add in an OnLoad event!


Ok, so far we've covered most of the important parts of our code that are relevant to seeing the link between movie clips and classes. There is still some code left to cover, but let's first look at how to actually use this movie clip both manually and programmatically.

Onwards to the next page!

1 | 2 | 3 | 4 | 5




SUPPORTERS:

kirupa.com's fast and reliable hosting provided by Media Temple.