What is Software? | What is Education? | What is Technology? | What is Research? | What is Wi-Fi? | What is Communication? | What is Customer Service?

Free SEO Tutorials & Help

Tutorials:   Adobe Flash   Adobe Photoshop   CorelDRAW   SEO  

Site Map

Website Development | Cable & Broadband Magazine | Solutions for Higher Education | Auction Anything Online

Adobe Flash Help & Tutorials

 Back to Topics

 

Using ActionScript: How to Work with Objects and Classes in Flash

ActionScript: Work with Objects and Classes

Set up your workspace

Learn about classes and object types

Create an object from a class

Modify your script

Create a custom class

Specify the data type for method return values

Build a custom class

Create two objects from the Product class

Learn about extending existing classes

Extend the MovieClip class to create a new class

Summary

ActionScript: Work with Objects and Classes 

TOP

Classes are the blueprint for objects in Macromedia Flash Basic 8 and Macromedia Flash Professional 8. All objects in Flash have an underlying class; for example, all movie clips have a method called getURL(), and getURL() is defined in the class definition for a movie clip. Flash contains many predefined classes, such as the MovieClip class, the Array class, the Color class, and the CheckBox class. This tutorial will show you how to create and modify classes.
 

Set up your workspace

#TOP

First, you'll view the finished files and set up your workspace to use an optimal layout for taking lessons.

  1. View the finished files.

    This lesson does not include start files. You can find finished files of handson1.fla, handson2.fla, handson3.fla, Product.as, and Drag.as, which are examples of the files that you'll create in this lesson:

    • In Windows, browse to boot drive\Program Files\Macromedia\Flash 8\Samples and Tutorials\Tutorial Assets\ActionScript\Work with Objects and Classes.

    • On the Macintosh, browse to Macintosh HD/Applications/Macromedia Flash 8/Samples and Tutorials/Tutorial Assets/ActionScript/Work with Objects and Classes.

  2. Select Window > Workspace Layout > Default to configure your workspace.

 

Learn about classes and object types

TOP

A class, also referred to as an object type, is like a blueprint. An object doesn't exist until you create it, or instantiate it, from a class definition. An object is an instance of a class.


Properties are the characteristics of an object. For example, when you align movie clips, you change the _x and _y properties of the MovieClip object. A property is a variable that is attached to a class. A property can either be public, which means it is accessible outside the class, or private, which means it can be accessed only within the class.


In object-oriented terms, a method is a behavior or procedure that can act on the object. A hypothetical throw() method on a ball would know the size and weight of the ball. A method is aware of the object and all the properties that it contains and can work on that object.


 

Create an object from a class

TOP

You'll create an existing class using visual tools (the TextField class) and code (using the Date class).

  1. Open a new Flash document and change the name of Layer 1 to Text.

  2. In the Text layer, create a dynamic text field and assign it the instance name of currentDate_txt.

  3. Create an Actions layer.

    With Frame 1 of the Actions layer selected, open the Actions panel.

  4. Create, or instantiate, an object from the Date class, named myDate:

    var myDate:Date=new Date();

  5. Create a variable called currentMonth equal to the getMonth() method:

    var currentMonth:Number = myDate.getMonth();

  6. Trace the value of currentMonth:

    trace (currentMonth);

  7. Save and test the document.

    You should see a number in the Output panel that represents the month.

    The getMonth() method displays the current month. The getMonth() method is zero-indexed, meaning the numbering begins at zero rather than one, so the number displayed is one less than what you would expect.

  8. Close the Output panel and the SWF file window.

 

Modify your script

TOP

You'll modify your script to compensate for the zero indexing.

  1. Add +1 to the value when you create currentMonth, and test your document to be sure the expected month number appears.

    That line of script should read as follows:

    var currentMonth:Number = myDate.getMonth()+1;

  2. Comment the trace statement:

    // trace (currentMonth);

  3. Below the trace statement, set the autoSize property of your text box to true:

    currentDate_txt.autoSize = true;

  4. Use the text property of your text box to display today's date in the form Today is mm/dd/yyyy.

    Use the currentMonth variable you already created, plus the getDate() and getFullYear() methods of the Date object:

    currentDate_txt.text="Today is "+currentMonth+"/"+ myDate.getDate() + "/"+myDate.getFullYear();

  5. Verify that your script appears as follows:

    var myDate:Date=new Date();

    var currentMonth:Number = myDate.getMonth()+1;

    // trace (currentMonth);

    currentDate_txt.autoSize = true;

    currentDate_txt.text="Today is "+currentMonth+"/"+ myDate.getDate() + "/"+myDate.getFullYear();

  6. Save and test the document.

    The current date should appear in the SWF file window.

     

Create a custom class

TOP

Although ActionScript includes many classes of objects, such as the MovieClip class and the Color class, there will be times when you need to construct your own classes so you can create objects based on a particular set of properties or methods.

To create a class that defines each of the new objects, you create a constructor for a custom object class and then create new object instances based on that new class, as in the following example:

NOTE The following ActionScript is an example only. Do not enter the script in your lesson FLA file.

function Product (id:Number, prodName:String, price:Number)

{

this.id = id;

this.prodName = prodName;

this.price = price;

}

To properly define a class in ActionScript 2.0, you must surround all classes by the class keyword, and you must declare all variables in the constructor outside of the constructor.

NOTE The following ActionScript is an example only. Do not enter the script in your lesson FLA file.

class Product

{

// variable declarations

var id:Number

var prodName:String

var price:Number

// constructor

function Product (id:Number, prodName:String, price:Number){

this.id = id;

this.prodName = prodName;

this.price = price;

}

}

To create objects from this class, you could now use the following code:

NOTE The following ActionScript is an example only. Do not enter the script in your lesson FLA file.

var cliplessPedal:Product=new Product(1, "Clipless Pedal", 11);

var monkeyBar:Product=new Product(2, "Monkey Bar", 10);

However, in ActionScript 2.0, variables that are part of a class structure should not be accessed directly. Write methods within the class that will access these variables directly. Different methods should get and set properties (known as "getter" and "setter" methods). You must indicate the data type for both a method's return value and any parameters that are passed to the method when it is called.

 

Specify the data type for method return values

TOP

You must indicate data types for values returned by methods after the method name and list of parameters, as in the following example:

NOTE The following ActionScript is an example only. Do not enter the script in your lesson FLA file.

public function getProductName() :String

{

return name;

}

If no value is returned (for example, a property is being set), the data type is Void:

public function setProductName(productName:String) :Void

{

this.productName=productName;

}

 

Build a custom class

TOP

You'll now build a new Product class with getter and setter methods and create an object from the Product class.

  1. Create an ActionScript file by doing one of the following:

    • If you're using Flash Professional 8, select File > New > ActionScript File (Not Flash Document). Save the document with the name Product.

    • If you're using Flash Basic 8, open a text editor, such as Notepad. Save the file with the name Product.as. (Remember to give the file the .as extension, to create an ActionScript file.)

  2. Create a constructor for a Product class by creating a function called Product that takes the arguments id, prodName, and description:

    function Product (id:Number, prodName:String, description:String)

    {}

  3. In the constructor function, set the properties of the Product class equal to the setter methods that you will create:

    setID(id);

    setProdName(prodName);

    setDescription(description);

  4. Surround the class keyword with the constructor function.

    Declare each variable used in the class:

    class Product

    {

    var id:Number;

    var prodName:String;

    var description:String

    function Product (id:Number, prodName:String, description:String)

    {

    setID(id);

    setProdName(prodName);

    setDescription(description);

    }

    }

  5. Define getter and setter methods for each property of the class, as in the following example.

    Specify Void as the return type for the setter methods, and indicate the data type returned for the getter methods.

    class Product

    {

    var id:Number;

    var prodName:String;

    var description:String

    function Product (id:Number, prodName:String, description:String) {

    setID(id);

    setProdName(prodName);

    setDescription(description);

    }

    public function setID (id:Number) :Void

    {

    this.id = id;

    }

    public function setProdName (prodName:String) :Void

    {

    this.prodName = prodName;

    }

    public function setDescription (description:String) :Void

    {

    this.description = description;

    }

    public function getID () :Number {

    return id;

    }

    public function getProdName () :String {

    return prodName

    }

    public function getDescription () :String {

    return description;

    }

    }

  6. Save your file.

 

Create two objects from the Product class

TOP

You'll create a new FLA file, and then create two objects from the Product class.

  1. Open a new Flash document and save it in the same location where you saved Product.as.

  2. In the new document, select Frame 1 in the Timeline.

  3. In the Actions panel, create two objects from the Product class using the data shown in the following table (the ActionScript that you'll create appears after the table).

  4. Instance name

    Data

     

    pedals

    id

    0

    prodName

    Clipless Pedals

    description

    Excellent cleat engagement

    handleBars

    id

    1

    prodName

    ATB

    description

    Available in comfort and aero design

     

  5. Verify that you created the objects as follows:

    var handleBars:Product = new Product (1, "ATB", "Available in comfort and aero design");

    var pedals:Product=new Product(0,"Clipless Pedals","Excellent cleat engagement");

  6. Trace the description property of pedals:

    trace (pedals.getDescription ());

  7. Save and test the document.

    You should see the description of pedals in the Output panel.

NOTE A finished sample file of the document you just created, named handson2.fla, is located in your finished files folder.

 

Learn about extending existing classes 

TOP

The extends keyword in ActionScript 2.0 allows you to use all the methods and properties of an existing class in a new class. For example, if you wanted to define a class called Drag that inherited everything from the MovieClip class, you could use the following:

class Drag extends MovieClip

{}

The Drag class now inherits all properties and methods from the existing MovieClip class, and you can use MovieClip properties and methods anywhere within the class definition, as in the following example:

NOTE The following ActionScript is an example only. Do not enter the script in your lesson FLA file.

class Drag extends MovieClip

{

// constructor

function Drag ()

{

onPress=doDrag;

onRelease=doDrop;

}

private function doDrag():Void

{

this.startDrag();

}

private function doDrop():Void

{

this.stopDrag();

}

}

NOTE The Convert to Symbol dialog box now offers a class field in which you can associate visual objects (such as movie clip) with any class that you define in ActionScript 2.0.

 

Extend the MovieClip class to create a new class

TOP

You'll create a new class by extending the built-in MovieClip class.

  1. Create a new Flash document and name it Shape.fla.

  2. Using the drawing tools, draw a shape on the Stage.

    With the entire shape selected, right-click (Windows) or Control-click (Macintosh) the shape and select Convert to Symbol from the context menu.

  3. In the Convert to Symbol dialog box, select Movie Clip as the behavior, and click Advanced.

    Select Export for ActionScript.

  4. In the Name text box, enter myShape.

  5. In the AS 2.0 Class text box, enter Drag.

    Click OK. This associates the movie clip with the Drag class that you'll create.

  6. Using the Property inspector, assign the movie clip an instance name, then save the FLA file.

    NOTE A finished sample file of the document you just created, named handson3.fla, is located in your finished files folder. For the path, see Set up your workspace.

  7. Create an ActionScript file by doing one of the following:

    • If you're using Flash Professional 8, select File > New > ActionScript File (Not Flash Document). Save the document with the name Drag, in the same location where you saved Shape.fla.

    • If you're using Flash Basic 8, open a text editor, such as Notepad. Save the file with the name Drag.as, in the same location where you saved Shape.fla.

  8. In the ActionScript file that you just created, create a new class and constructor called Drag:

    class Drag extends MovieClip

    {

    function Drag ()

    {

    onPress=doDrag;

    onRelease=doDrop;

    }

    }

  9. Define private methods in the class that use the existing movie clip methods, startDrag() and stopDrag():

    class Drag extends MovieClip

    {

    function Drag()

    {

    onPress=doDrag;

    onRelease=doDrop;

    }

    private function doDrag():Void

    {

    this.startDrag();

    }

    private function doDrop():Void

    {

    this.stopDrag()

    }

    }

  10. Save the ActionScript file.

  11. Test the Shape.fla file.

    You should be able to drag the movie clip.

NOTE An example of the ActionScript file you just created, named Drag.as, is located in your finished files folder.

Summary

TOP

Congratulations on learning how to work with objects and classes in ActionScript 2.0. In a few minutes, you learned how to accomplish the following tasks:

  • Create and use objects from existing classes.

  • Create a custom class.

  • Create a property within a custom class.

  • Create a method within a custom class.

  • Extend an existing class and take advantage of inheritance.

 

 
 

Copyright ADOBE - All Rights Reserved Worldwide

 

 

More Topics:

Working with Flash Documents

How to work in Flash WorkSpace

Working with Projects in Flash

Process to Build your First Application in Flash

Using Symbols, Instances and Library Assets in Flash

How to Build Video Player in Flash

How to Work with Color, Strokes and Fills in Flash

How to Create Document in Flash

What is Vector and Bitmap Graphics in Flash

How to Create a Banner in Flash, Part 1

How to Work with Text in Flash

How to Create a Banner in Flash, Part 2

How to Use Imported Artwork in Flash

How to Create a Banner in Flash, Part 3

How to Work with Graphic Objects in Flash

How to Work with Layers in Flash

How to Use Filters and Blends

Working with Graphics in Flash

What is Accessibility Features in Flash

How to Create Motion (Shape Tween & Motion Tween) in Flash

How to Create an Application in Flash

What is Masking in Flash

How to Work with Video in Flash

How to Use Layout Tools in Flash

What are Behaviors in Flash

How to Work with Sound in Flash

How to Create Symbols and Instances in Flash

What is ActionScript in Flash

How to Write ActionScript With Script Assist in Flash

How to Add Button Animation and Navigation in Flash

What is Data Integration in Flash

How to Work with Screens

How to Create a Presentation with Screens

What is Extending Flash

How to Create Multilanguage Text in Flash

How to Create Graphics: Draw in Flash

What is Flash Lite

Ways of Data Integration

How to Create Graphics: Create a Timeline Animation in Flash

Getting Started with Flash Lite in Flash

How to Publish Flash Documents

How to Create Graphics: Making Animations with Easing

Learning Flash Lite 1.X ActionScript in Flash

How to Export Flash Content and Images from Flash

How to Create Graphics: Applying Gradients in Flash

Process of Writing and Editing ActionScript 2.0 in Flash

How to Create Accessible Content in Flash

How to Create Graphics: Apply Graphic Filters and Blends

What is Data and Data Types in Flash

Process of Printing from SWF Files in Flash

Using ActionScript: How to Use Script Assist mode in Flash

Learn Syntax and Language Fundamentals in Flash

How to Create E-learning Content in Flash

Using ActionScript: How to Write Scripts in Flash

Working with Functions and Methods in Flash

Process of Using Templates in Flash

Using ActionScript: Process of Adding Interactivity in Flash

What are Classes in Flash

Control Tag Summary of XML to UI in Flash

Using ActionScript: How to Create a Form with Conditional Logic and Send Data in Flash

What is Inheritance in Flash

What is Data Integration: Overview

Using ActionScript: How to Work with Objects and Classes in Flash

Overview on Interfaces in Flash

What is Data Integration: Using XML for a Timesheet

How to Work with Text and Strings in Flash

How to use Handling Events in Flash

What is Data Integration: Using XUpdate to Update the Timesheet

Learning Animation, Filters and Drawings in Flash

How to Work with Movie Clips in Flash

How to Create Interaction with ActionScript in Flash

How to Work with Images, Sound, and Video in Flash

How to Work with External Data in Flash

What is Security in Flash

How to Debug Applications in Flash

List of Error Messages in Flash

Using Object-Oriented Programming with ActionScript 1.0 in Flash

How to Write Scripts for Earlier Versions of Flash Player in Flash

List of all Keyboard Keys and Key Code Values for using in Flash

Terminology

Introduction to Components in Flash

What are Components in Flash

How to Create an Application with Components

How to Work with Components in Flash

How to Handle Component Events in Flash

How to Customize Components in Flash

How to Create Components in Flash

What is Collection Properties in Flash