Categories
Featured jobs
» More ActionScript, Flash and Flex jobs.
» Advertise a job for free
Our network
Advertisement

 »  Home  »  Tutorials  »  Flash  »  Beginner  »  AS 3.0 Coming From 2.0 - Article 2

AS 3.0 Coming From 2.0 - Article 2

By Bryan Grezeszak | Published 10/29/2007 | Beginner | Rating:
Bryan Grezeszak
Bryan Grezeszak does Flash AS 3.0 development at Elemental in Troy MI. He is a thorough expert of both ActionScript 2.0 and 3.0, and is more than willing to answer any questions you may have.
 

View all articles by Bryan Grezeszak
2 key lessons

Lesson 5: Class Inheritance Overview

In order for me to teach you what I really want to with this article, you need to have a decent understanding of how a class works. In AS 3.0, inheritance is based completely off of classes. Therefore it it pretty important that you understand what a class is (and what inheritance is!) In the most simple context, a class is a definition. There is a class that defines what a MovieClip is (we'll use MovieClip as an example since most are familiar with it.) Inside this class, there are definitions that define properties (in simplest context: variables), methods (in simplest context: functions), and events (things that you can listen for using a listener, and use to call a function.) Something very important to realize is the difference between a class, and an instance of a class. MovieClip is a class. myClip_mc that I make on the stage is an instance of that class, and each class can have variables, functions, etc. that are available to it.

What you really need to know is that when writing one class, you can extend another class. What this means is: one class is built as an extension of the other class, inheriting all it's stuff. If you make a class called Circle that extends MovieClip, then Circle has everything it needs to be an object that displays on the stage, has an x value, y value, width, height, and everything else that a MovieClip has. That begs the question "why do that, just make a MovieClip". The answer is that it's not called extend for nothing. You can then add things to the new class to make it more useful for it's specific role. Where a MovieClip is not always a circle, making a property called radius on it would be pretty dumb, but on the Circle class it is a very good idea. This is the entire idea of class inheritance. Start with one simple class that is vague, and encompasses everything (in Flash's case, that class would be the Object class, hence it being an Object oriented language) and build more and more classes, each extending off of the classes below it, branching apart, etc. until you can build them into very specific roles. Then give the the programmer the ability to write their own classes for even more specific things.

Lesson 6: Basics of Writing a Class

In the end, classes are the way to go in Flash. Whether to store info, or even to create objects on the stage. For the basics of writing a class (the basics only, I'm not going over advanced concepts in this line of articles), you start with an external actionscript (.as) file. The first part of a class file is the package. The package is a way that you can group classes together, put them in folders, etc. We're not going to give our class a package, but we still have to write the statement out, just not give it a name:

  1. // defining our package - no name, no package
  2. package
  3. {
  4.     
  5. }
  6. // Notice we opened and closed it with brackets, you write tghe class inside those

After we make the package statement, we need to define the actual class. You name your class the same as you name your .as file (except without the .as and with any spaces removed.) We'll call our class Circle, because we want to build a class that is exclusively for building circle movie clips.

  1. // now defining our class, named Circle, so my file would be named Circle.as
  2. package
  3. {
  4.      public class Circle
  5.      {

  6.      }
  7. }
  8. // Notice we opened and closed it with brackets too, you write the parts of the class inside those

Notice the word public. That means that the class is publicly accessible from anywhere in the code that uses this class. There's a number of identifiers to use like this for the variables and functions, but the class needs to be public so that we can use it. Now what do we want this class to do? We want it to be a MovieClip that is specifically a circle. So we need it to extend MovieClip. Do this:

  1. package
  2. {
  3.     import flash.display.MovieClip;
  4.     public class Circle extends MovieClip
  5.     {
  6.     
  7.     }
  8. }

We did two main things here. We put the extends MovieClip part right after the class name, and we added an import, because otherwise the script wouldn't have known what the MovieClip class was, so we had to import it before using it. Next we need to add some things inside of the class, so that it's actually doing something. The simplest things to do are define variables (properties) and functions (methods.)

  1. package
  2. {
  3.     import flash.display.MovieClip;
  4.     public class Circle extends MovieClip
  5.     {
  6.          public var radius = 10;
  7.          public var fillColor = 0xFF0000;
  8.          
  9.          public function drawTheCircle()
  10.          {
  11.              this.graphics.clear();
  12.              this.graphics.beginFill(fillColor);
  13.              this.graphics.drawCircle(0 , 0, radius);
  14.          }
  15.      }
  16. }

I added two variables and one function. The three lines of code inside the function may look foreign to you, but that doesn't matter, all you need to know is that they will draw a circle that has whatever color the fillColor is, and has a radius of whatever the the radius variable is. Both of these variables could be changed before the circle is drawn with the function, or changed again and the function called again. Here is how you would use this class you just built in real practice:

  1. // import the class you just built, the class file must be in the same folder that the .swf publishes to
  2. import Circle;
  3. var myCircle = new Circle(); // creating a new instance of the class Circle
  4. myCircle.radius = 20; // setting your own radius
  5. myCircle.fillColor = 0x0000FF; // setting the fillColor to Blue
  6. myCircle.drawTheCircle(); // calling the function to draw the circle out
  7. myCircle.x = 100; // setting the x value, which it has, because it extends a MovieClip!
  8. myCircle.y = 100; // setting the y value, which it has, because it extends a MovieClip!
  9. addChild(myCircle); // in AS 3.0, when you make something, it doesn't add it to the stage automatically, this line of code does it

This is the extreme basics of a class. Some other bits you may like to know:

If you put a function inside a class with the same name as the class, it automatically calls that function when you make an instance of the class (which was the "new Circle()" line of code we just did.) This function must be public, and must not return a value. It is referred to as the constructor.

There is keyword called "static" that means that the particular variable or function is part of the class, not any instance of the class. That may sound confusing, but if you think about it, you've done this before. Such as the Math class. Math.round(), Math.floor(), Math.random() are all static functions of the Math class, you just call them using the class name. To declare it this way you would put: public static function functionName() . Of course you're using public because it's the only one I've taught you!, and static makes it call from the class. This would be handy for a standard bit of information, such as a class of messages for welcome, exit, whatever. You'd make a class called Messages, then declare everything static, and then (after importing the class) you can just call the using Messages.message1, or Messages.message2, etc.



This has been a tutorial by:

(\___/)
(='.'=) <------ Mad Bunny Skills
(")_(")

Bryan Grezeszak | of Elemental


How would you rate the quality of this article?
1 2 3 4 5
Poor Excellent

Verification:
Enter the security code shown below:
img


Add comment

Spread The Word / Bookmark this content

Clesto Digg it! Reddit Furl del.icio.us Spurl Yahoo!

Article Series
This article is part 1 of a 2 part series. Other articles in this series are shown below:
  1. AS 3.0 Coming From 2.0 - Article 2
  2. AS 3.0 Coming From 2.0 - Article 3
Comments
  • Comment #1 (Posted by HM)
    Rating
    Hey Bryan,
    Thanks for the tutorials, they are really very useful for a beginner level programmer like me. I really look forward to the next one.
    I just tried the example in tutorial 2 but somehow its not working. I get the following error:
    1119: Access of possibly undefined property graphics through a reference with static type Circle. this.graphics.clear();

    Hope you can help!


     
  • Comment #2 (Posted by kareem - kygersoft at yahoo.com)
    Rating
    i think this is a good idea to help desingers with little knowledg of action script to move from 2 to 3 .. i'm not very good in AS2 but i use the basics and would love to move to 3 but not now .. any way there is no tutring courses in my country that teaches AS other than the basics "goto , play , stop , etc.." and i'v read on the net that AS is a bit similar to another programing language "java or java script" i was wondring will it help me to take any courses in them since i have programing courses for them in my country and will it make it easier to learn AS after learninig them .. thanx
     
  • Comment #3 (Posted by Bryan Grezeszak - bryan at elemental.us.com)
    Rating
    My apologies to those who have asked me questions on this site, I incorrectly assumed I would get e-mail notification for comments, and was completely unaware of them.

    -@HM
    That error is telling you that the class that you created does not have the graphics property. The graphics property of the Circle class in my example was inherited from MovieClip, so the most likely explanation is that you forgot to extend MovieClip with your code.

    -@kareem
    AS 2.0 is very similar to Javascript and AS 3.0 is very similar to Java. Many beginners to not realize that they are very different languages. I would say that if AS 3.0 classes are not offered in your country, the concepts you would learn in Java would be VERY applicable to AS 3.0. They are by no means the same language, but the concepts are very close.
     
Submit Comment



Search Entire Site
Add to Google
Advertisements
Article Options
Latest New Articles
Set up a simple IIS Server for Flash
by Peter McBride

Day 1 at FITC Toronto 2008
by Anthony Pace

Simple reflection effect with AS2
by Jean André Mas

ActionScript.org Meets Josh Tynjala (aka dr_zeus)
by ActionScript.org Staff

Rapidly Create Online Flash Movies to Help Users Market, Sell and Support Software and Hardware
by Sabrina F

mailing list
Enter your email address:
mailing list
Subscribe Unsubscribe
© 2000-2007 actionscript.org! All Rights Reserved.
Read our Privacy Statement and Terms of Use...
Our dedicated server is hosted and managed by WebScorpion Webhosting.