The Basics of ActionScript
The basics of Classes, Methods and Properties
As I pointed out earlier, ActionScript is an OOP language. As such it involves the use of classes, objects and instances. In OOP everything is associated with a class. Drag a movie clip from the library onto the stage and the MovieClip class gets instantiated into that object as soon as it hits the stage. This explains why we talk about naming an instance. All class files have two main characteristics: methods and properties.
To start understanding this section you need to understand the concept of “object”.
An object is the building block for your code and is composed of data, called properties and related functions called methods.
Think of an object named “dog”. The things that make up a dog, it’s properties, could be: four legs, fur, tail. The things a dog can do, its methods, could be: fetches, sleeps, eats. Put all of those things together and you could have a dog object with four legs, a tail and fur that fetches, eats and sleeps. To differentiate one dog from another - poodle from terrier- we use the word “breed” because the properties and methods of a terrier are fundamentally different from those associated with a poodle. Instead of using the word “breed”, in OOP, programmers use the word “class”.
Classes are rather simple to understand. For example let’s assume that, as you read this. a poodle is curled up at your feet. The poodle belongs to a class called dog, which in turn belongs to a class called mammal. For the sake of simplicity, a defining feature of the mammal class could be : 4 limbs as well as fur. A mammal can also have a method that is called: walk() and talk(). These are properties common to all mammals. The talk() method can be used by the dog class to bark and the dog can use the walk() method to walk on all 4 limbs. The fur property would be set to curly in the poodle. Thus if we have an object that walks on four feet, barks and has curly fur we can assume we are looking at a poodle.
The important point here is not the poodle. The important aspect of this is that the main methods and properties in these classes are common to these classes. The specifics of a method are handled in the subclasses (namely dog and poodle). If an animal in the dog class doesn’t have curly hair, it is another class of dog, not a poodle. The other thing to notice is how poodles can use the Dog methods and properties which in turn use the Animal methods and properties. If you have a thing curled up at your feet that meows and has long hair the odds are very good you have a long hair cat at your feet. The interesting thing about the Cat class is it shares the methods, properties and events of the mammal class just like the poodle.
What do dogs, cats and ActionScript have in common? They use classes.
ActionScript contains over 100 built in classes which are the pre defined data types you use to make things work. To access the methods and properties associated with a class you have to create an instance of the class except, instead of dragging an object onto the stage, you create the instance when you declare the variable and set its data type using ActionScript.
The MovieClip class is a good starting point to understand how methods and properties are associated with a class. Methods , in many respects can be regarded as verbs. They are the things do stuff. Two methods associated with the MovieClip class are stop() and gotoAndPlay(). Properties are the adjectives. They describe the MovieClip. For example if you select a movie clip on the stage the Property inspector tells you the height and width of the selection as well as its x and y position on the stage. If you can see it, another movie clip property is in play as well. It is visible. If you skip the library and create one while the movie is playing , you would do it this way:
Var myMovieClip:MovieClip = new MovieClip();
myMovieClip._x = 250;
myMovieClip._y = 250;
myMovieClip._width = 100;
myMovieClip._height = 150;
myMovieClip._visible = True;
That first line of the code is called an instantiation. In this case you would be creating a new instance of the MovieClip class using a strict typed variable named myMovieClip. When it appears, it will be a square object of 100 x 100 pixels whose center point is located 250 pixels across the stage and 250 pixels down.
You can’t create your own custom classes directly in the Actions panel. Thye must be created in an external file that uses the .as extension that are subsequently compiled into the SWF when it is published. Creating a custom class is well out of the scope of this book which means we will be staying with the built in classes that are included in ActionScript.
Scope
In the note above this subhead we told you that creating a custom class is “well out of the scope of this book”. You understood what we were talking about because we used the word “scope” in the context of the purpose of this book, which is to teach you how to use Flash 8 Professional, not become a hard core ActionScript programmer. When it comes to working with ActionScript variable scope,how it works and how it is used is one of those concepts that will drive you up a wall, across the ceiling and down the other wall.
A scope is an area in your Flash file where a variable can be referenced. If a variable is found in frame 2 of the main timeline, that is where it is referenced. If it is found in frame 35 of a movie clip located on frame 50 of the main timeline that is where the variable is referenced. For many people new to ActionScript the concept of scope is not easy to grasp and it will require a high degree of patience on your part to become comfortable with this concept.
Earlier in this lesson I explained what a variable is, how it is created and made it very clear to you that variables cannot have the same name. Not quite. Variables can have the same name only if they are in a different scope. There are three available variable scopes in Flash: Local, Global and Timeline.
Local variables: These are variables that are local to a certain area, like a frame or a function. They have extremely short lives that are limited only to the time that area is executing. As soon as it finishes executing and exits that area, the variables no longer exist. Local variables are easy to identify in a function because the variable is declared between the curly braces commonly used by a function or control statement. However, curly braces can be used within your code to simply delimit a local area.
When these variables are declared, the variable can’t be used elsewhere on the Timeline or in other bits and pieces of code in the movie outside of where it is declared. This is a “good thing” because you can use the variable name elsewhere in the movie and not have it conflict with the one in the function. Here’s an example:
function myBigFatVariable() {
var groceries:String;
}
trace(groceries);
If you were to run this to the Output panel it would tell you groceries is undefined. This is because groceries only lives in the myBigFatVariable function and nowhere else.
Tip: Trace statements are invaluable coding aids .They are used by programmers to output test results of the code, follow variable values and so on. The results will appear in the Output panel.
Global variables: These variables are available anywhere at any time to anything. You can declare a global variable and then use it in other frames and other SWF’s or movie clips that are loaded into the main SWF without making extensive changes to you code or file structure. The major difference between a global variable declaration and a local variable declaration in ActionScript is that global variables are not defined using the var keyword. Instead they start with _global as shown below:
_global.groceries = “Lettuce”;
Timeline variables: These variables are only available to any script within the same timeline. If the variable is used on the main time line it is available to scripts on the main timeline. If it is used on the timeline of a movie clip located on the main timeline; it is only available in the movie clip timeline. Again, because the variable is only available to a specific timeline, you can have the same variable name used on various timelines without running into any problems.
Once a variable is declared on a Timeline it is available to all of the frames after the variable has been declared. For example, assume groceries is declared in frame 10. All frame from frame 10 onwards can use the groceries variable. Frames 1 to 9 won’t have a clue what a “groceries” is and it will be unavailable to those frames in the SWF.
Moving between timelines and levels
Knowing that variables can exist on various timelines is good information to know. The next question is: “So, how do I get at those variables?” To answer that question you have to understand the difference between _parent,_root, this and level.
Let’s assume you have some code in a movie clip on the stage and you need to access a button that is sitting on a timeline containing that movie clip. You would use the _parent method to access the timeline. What you can assume from this is those keywords each, in one form or another, tell the SWF where to go to access variables in the various scopes.
The keyword _parent references the parent timeline of the current object. The parent of a movie clip sitting on the main time line is the main timeline. The parent of movie clip 2 sitting on the timeline of movie clip 1 which sits on the main timeline is movie clip 1. (Movie clips that are inside other movie clips are said to be “nested”.) The key word this means you are referring to the current object in the current scope. For example, if this is used on the timeline in movie clip 2, the scope of the variable referred to would be limited to the timeline of movie clip 2.
Still the use of the keyword this is one of those things that is difficult, at first, to understand. A lot of what it can do is based upon the context in which it is used. If you use this within a movie clip it refers to the timeline of the movie clip. However use this with a button and it refers to the timeline where the button instance is found, not he button, itself.
As you go through this course you will be using movie clips as buttons on the main timeline to navigate to a frame. If you use the keyword this to tell the playback to go and play frame 2, Flash will move the playback head to frame two of the movie clip being used as a button. If you have the same instruction on a button on the main timeline, the playback head will go to frame 2 of the main timeline.
Let’s look at an example using a small piece of code that treats a movie clip like a button - a very common practice- that stops the playback head when the mouse button is released:
myMovie.onRelease =function(){
this.stop();
}
Now, let’s give this code some context. Let’s assume there a sound playing on the main time line and a ball is bouncing around the screen in the movie clip which is sitting on the main timeline. When you and you click the movie clip, the ball stops bouncing but the sound keeps playing. This happens because the ActionScipt inside a function targets the movie clip’s timeline using the this keyword.
Remove the keyword and the code becomes:
myMovie.onRelease =function(){
stop();
}
In this case the sound would stop playing and the ball would stop bouncing . This is because buttons target the timeline they are sitting on and you just stopped the main timeline from playing.
When you start cruising Flash tutorial sites or purchase books that explain Flash, you will encounter the use of _root on a very regular basis. When you see it used, it means the person developing the Flash file is directly targeting the main timeline of the SWF. If you understand that you can also understand the subtle difference between _root and _parent.
There is the potential for an issue when you use _root, especially when you are loading SWF files into other SWF files. Remember _root targets the main timeline of the SWF that is loading all of the other SWF’s into the movie. Let’s assume you have developed a Pac Man game. The level maps are located in a SWF called Levels.swf and the controls, in a SWF called Controls.swf- are loaded into the Levels.swf file when the movie loads into a browser. The main timeline, therefore, is Levels.swf. Any references in Control.swf to _root are going to target the _root of Levels.swf and not the _root of Controls.swf. The upshot is incorrect playback and hours of unnecessary debugging and backtracking to isolate the problem. Which brings us to the keyword level.
If a SWF is going to be a self-contained unit, feel free to use _root. If other SWFs are loaded in using the loadMovie() method, use _parent in those SWF’s, instead of _root. Better yet use the _lockRoot property in the main timelines of your movie clips being loaded. This will ensure that your SWF’s use their intended main timelines.
When you load new SWF files or other content into a SWF, one of the parameters you will be asked to set is the level. Think of levels as being the stacking order of items on the stage. For example, in Lesson 6 you will be littering the stage with Pixie Dust that is nothing more than a movie clip in the library. That movie clip is added to the stage using the attachMovie() method which requires three parameters be added inside the brackets- (idName, newName, depth). Depth or level determines where in the stack of clips this particular one is located. Levels have a very specic stacking order. The main timeline is always _level0. When content is loaded in it gets placed onto new levels that are numbered in the stacking order.
Don’t equate Levels with Flash layers. Instead think of layers as being more like a stack of playing cards on the table. The table they are sitting on would be level0 and the last card at the top of the deck would be sitting on levelr52. The kicker is this: the table and the cards could be sitting on any layer in the Flash interface.
