Make your own free website on Tripod.com

About Class in AS2


I am not interested in developing UIComponents, when will I need to write a class file ?

Our project contains a movie about a hunter and a lion, possibly we dont need class file. Just write codes to the lion and write codes to the hunter to finish the game.

What if our project contains a hunter and many ducks ? Well, we write codes to the hunter and then write codes to "a duck" then either copy the codes to other ducks or make the duck a symbol with linkage, then we can create many ducks with similar functions.

This is the first step of OOP, do classification. We make many ducks as instances of DUCK.

But, exportable symbol is enough, why class file ?
Why do we break symbol into class file and graphic part ?


Break symbol into class file and graphic assets

When Flash 4 appeared, many Flash movies are created by motion tween. Only simple action scripts such as "gotoAndPlay(2)" are supported.

Flash 5 increased the role of action script. However, action script disturbs or aborts motion tween. To mix tween motion and script-driven motion is troublesome. Although script-driven motion is more abstract, it gives more interactive and precision for the motion. So, single frame movies became popular. All motion is driven by script. No tween. Programing becomes essential to designer.

Flash 6 supports more OOP concept. The concepts about "Class" becomes popular. What is the difference between instance of symbol and instance of class ?

I can think of three.

Saving of memory

For symbol, we defined every properties and methods in the first frame. When we create 50 instances of this symbol, similar methods and properties are created when first frame of the instance is played. Methods are created by reading the script of the first frame. We will have 50 copies of those properties and methods in the memory pool. The preparation of those functions is a hard job, also the execution. What a waste of memory.

For Class, if we have 50 instances of that Class, we have only single copy of properties and methods in the prototype. Only the difference is stored in each instance. Otherwise, all of them call the methods stored in the prototype. This saves the memory markedly. The preparation is simple and also the execution.

Initialization process

For symbols, we define all propeties and methods in the first frame. If we need to call these methods or access these properties, we need to wait for the playhead plays the frame. They are not available immediately. In other word, we can only access those properties one frame after the instance is created. Usually we do a two frame movies, the first frame attaches the instances and the second frame calls those methods. It is not convenient.

For Class, we can use #initclip and constructor to initiate the methods, make the instance properties immediately active before the first frame. So, we can attach the instance and access its member methods immediately.

Power of the pattern

The third benefit is What "Class" really means. Since we break the calss file off the graphic elements, we can register different symbol to the same Class. If we have 3 symbols with different appearance, for example zombi, monster and ghost, but the same "properties and methods", we does not need to copy all the codes to the first frame of each symbol. We just register them to the same class.

Also, We can take advantage of the features supplied by the pattern such as "inheritance", "static", "public",,,etc. We can extend the Class and make a new Class "inherit" all the properties of the ancestor Class. We can not do that by symbols without Class.

So, this benefit extends into Flash 7. The javascript syntax is changed to java syntax. The implementation of "pattern" is more classical now.


How do I write my Class and how do I use this Class I created ?

I am not going to discuss this topic here. There are many tutorial written in better English than mine. If you feel difficulties to find the tutorial, find tutorial about java or C++. It is the same.

What I want to discuss is the relationship between graphic assetsl and Class. This is unique for Flash. No such information can be obtained by java tutorial.

I will also discuss briefly the difference between AS2 and other language about "static".


To create an instance of the Class

Classically, we use the keyword "new" and the constructor to create an instance of that class. We can have an argument-parameter list in the parenthesis of the constructor to initialize some properties.

But, for those Classes linked to MovieClip symbol, that is not the way to create instances of a Class symbol.

This is not new in Flash MX 2004. It is already so in Flash MX.

(The "createClassObject" in the UIObject is beyond this discussion.)

To make a movieClip instance of Class symbol, we still use the old way: either drag an instance from the library or use script:attachMovie to create an instance. We can not create a movieClip by "new MovieClip();".

Well, if we do not use "new", how the constructor is called and when all these Class properties are combined into the clip ?

For instance created by dragging from library onto the stage, Flash first resolves all the movieClip name as if there is only tween without script. The names of all the movieClips and their parent-child relations are resolved here. Lets say, this is a Flash4 movie.

What follows is the processing of Class. The instance take the Class definition as template or take the Class definition as __proto__ in Flash MX. Then it starts to initiate the Class by constructor. The processing starts from parent to child, the way similar to the initialization process of frame script. This process happens only in Flash 6 above.

Then it initialize the frame 1 scripts from parent to child like Flash 5 movie.

Please note several points:

1. Since we are not calling the constructor by script, we can not pass paremeter to the constructor. The only way to pass some parameter is through the "component parameters" panel. That is why the constructor of such Class usually does not have argument-parameter list.

2. Constructor is called before frame script. So, we can not call functions defined in frame script.

If we write some action in Class and some action in frames, it will be messy and hard to debug. So, most of the time, the frame script only has a script as "stop()".

It is strange to write script in a Class file to controlling other movieClips on the stage. Wraping too many things external like _root or _parent in the Class file is somewhat contradict to the OOP concepts. Some has a habit to write event handler in frame script not in the Class file. That is all right. If you want to solve such mess, you need to read the event handler section to understand the broadCaster and EventDispatcher.


The child movieClip

In my graphic symbol, I have a textfield named "textbox". How can I make setting to my textbox in the Class file ? How do we incorporate these child movieClip instance names into the Class ? Lets do from the ground.

class myLabel extends MovieClip{
    function myLabel(){
        super();
        textbox.text="default label";
    }
}

If we check syntax, the compiler complains that it does not know what "textbox" is. AS2 needs strict typing. It does not allow a variable with unknow typing. To remove the error of compiling, we modify our script as:

class myLabel extends MovieClip{
    var textbox:Textfield;
    function myLabel(){
        super();
        textbox.text="default label";
    }
}

OK, it passed the compiler's error reporting. But, will that codes work ? A java scripter will argue that, the textbox is not yet initialized by a "new" constructor, how can we access its "text" property ?

Yes, it works for that codes. When the symbol get debut on to the stage, it loads the graphic symbol and all those child movieClips like Flash 5 as if there is no Class thing. So, the instance has already a property as "textbox".

Then it process the Class thing from parent down to children. It links the symbol with the Class. It runs the constructor. When "textbox" appears in constructor, it access the textbox in this instance.

In fact, declare textbox typing does nothing but removing the error of compiling. We can replace it by "var textbox:Object;".

If in the constructor, we add "textbox=new TextField();" like we usually do in Java, what will happen ? Well, the variable "textbox" will be over-written and our textfield will behave weird. Just remember, we can not create Flash elements by "new".

Is that texdtbox variable initiated by super() ? Not really. MovieClip() only gives the extra-ability such as movieCliip.loadMovie(), movieClip.createEmptyMovieClip(), movieClip.attachMovie()...etc.

The internal properties such as _x, _y, _xscale exist without the need to run constructor of MovieClip(); The name of textbox is already load far earlier than the link between symbol and Class.

Also note that, the super constructor is empty. Flash permits that we omit the empty constructor, so we can omit the "super();" line.


The component in the Class

Lets go deeper.

What if I have a child Movieclip liked with a txtClip Class where a setText(string) method is defined ? For example, we put an UIComponent Button, Label, Combobox or List in our Class ?

class myLabel extends MovieClip{
    var myTxtClip:txtClip;
    function myLabel(){
        super();
        myTxtClip.setText("default label");
    }
}

Will this code work ?

No ! This will not work.

At first, all movieClips are loaded like Flash 5 movie. The variable myTxtClip is resolved but what is setText is not yet resolved. Class things are not yet processed. Classes are processed from parent to children. In this constructor, myTxtClip is accessible but it has not yet linked with the txtClip Class, so setText method is not accessible.


The attachMovie and createTextField

So the Child Class methods are not accessible by constructor of the Parent Class. In other word, we can not init Child when we init Parent. This reminds us the painful experience that we can access the child methods only after the next frame. So, how to solve it ?

The answer: Use attachMovie instead of dragging an instance to the stage.

When we attachMovie, the new attached clip loaded and linked to Class immediately. It first process the init Object if any, and then link the class and pass the constructor. Thus, it is handy to manipulate parameters and it is handy to access all these methods of Child Class.

class myLabel extends MovieClip{
    var myTxtClip:txtClip;
    function myLabel(){
        super();
        myTxtClip=attachMovie("txtClip","myTxtClip",2);
        myTxtClip.setText("default label");
    }
}

So it is highly recommanded that we create our child Clip or component by attachMovie. Instead of dragging a textfield on the stage, we create textfields by MovieClip.createTextField(). We add an empty movieclip by createEmptyMovieClip.

Several minor problems need to be considered.

If we create our clip by attachMovie, there will be nothing on the stage. All things happens in authors brain. This is a big challenge to designer who used to make movie by tween and see the things happen by dragging the playhead. It also increase the work that, we need to write down the value for _x, _y etc. The correct _x and _y needs some try and error.


The asset:

One of the benefit of OOP is "re-usalbe". We would like our symbol-Class re-usable.

Usually we can open this movie as library and then drag the symbol to the stage of another movie. We will see many assets symbols are also included and added to the library of another movie.

However, we have created every thing by attachMovie, there is nothing in our frames. When it is draged into another movie, no asset symbol elements are included. Flash will not collect what symbols, what link_ID are used in our Class. When we test our symbol-Class in another movie, nothing happens. We have created our child clip by attachMovie("ball", "ball",2), and Flash can not find a symbol with link_ID as "ball".

We need to drag over every symbols we have used by attachMovie in our Class file. We do not know what link ID have been used in our Class symbol until we search all the script in the Class file. It is even complex if our Class derived from a chain of inheritance. Or, if our Class involve components.

So, we may need to create an asset folder and put all the symbols we ever used in attachMovie into this folder. If we drag our Class symbol over, we also remember to drag this folder over. This is not a very perfect idea.

Macromedia recommand a technique. Make an extra frame where Flash never plays. Put all used symbol on that extra frame. This ensure that dragging over the Class symbol will include all those child symbols.

This is important when we make a component.

If we check the source fla of components in the mx.core.control, we see many fla file contains an empty first frame with stop() action. We see all the asset symbols in the second frame that will never be played.


ericlin@ms1.hinet.net