How to Create an AS3 Event Listener

Part 1: Introduction to AS3 event handling
Part 2: How to create an AS3 event listener
Part 3: The AS3 event object
by Alberto Medalla
Lecturer, Ateneo de Manila University

In this next part of the Flash AS3 Event Handling tutorial series, we're going take a look at how to write event handling code.

According to the Adobe Flash ActionScript 3 documentation, there are 3 important elements that need to be identified when working with event handling in Flash. These are: (1) the event, (2) the response, and (3) the event source. We've already introduced the concepts of events and responses in the first part of this lesson, but let's go ahead and take a look at them again with a little more detail. And then after that, let's take a look at what the event source is.

EVENT

An event refers to a specific occurrence that happens as your Flash movie runs. In ActionScript 3 event handling, events are identified by specifying the event class as well as the event constant. Event classes can be thought of as the different groups used to classify different kinds of events. There's an event class, which is also called Event. Some events that fall under this class are the complete, deactivate, and open events. Another example is the keyboard event class, which is written as KeyboardEvent. Some events that fall under this class are the key down (i.e. when the user presses a keyboard key) and key up (i.e. when a key is released) events. There's also another class for mouse events, which is written as MouseEvent. Event constants are specific names that refer to the events themselves. Let's consider the MouseEvent class, a few of the events that fall under this class are: mouse clicks and mouse roll overs (i.e. when the cursor hovers over a button). The constant for a mouse click is written as CLICK. For a mouse roll over, it is written as ROLL_OVER. Once these elements have been identified, writing the event in code takes on this form: EventClass.EVENT_CONSTANT So for example, if you were to specify a mouse click event then you would write: MouseEvent.CLICK. And if you were to specify a mouse roll over event, then you would write: MouseEvent.ROLL_OVER.

RESPONSE

A response refers to what is going to happen once Flash detects the occurrence of an event. For example, after a button is clicked (MouseEvent.CLICK), we can instruct the Flash movie to respond by playing an audio file. The response is specified as a function. This function's body will contain the line(s) of code that will tell Flash what to do. This function, referred to as an event listener (also sometimes referred to as an event listener function or listener function), will be called immediately after the specified event is dispatched and detected. function eventListener() { // response to make when the event happens } REMINDER: The terms event listener, event listener function and listener function all refer to the same thing - it is a function that is registered to execute when a specific event occurs.

EVENT SOURCE

An event source refers to the object that is directly related to the event. In most cases, it is the object from which the event originates from. For example, when dealing with mouse click events, the button that was clicked would be the object that the mouse click happens to, and is therefore considered as the event source. Another example would be when a URLLoader object loads an external text file. For instance, when a URLLoader finishes loading the file, this is considered as an event as well. In this case, the URLLoader is the one responsible for loading the external text file and is therefore considered as the event source. This event source can also be alternatively referred to as the event target.

After identifying these 3 elements, you bring them all together using the addEventListener() method. The addEventListener() method registers the event listener function with the event source so that the event listener function can "hear" when the event is announced. This is essentially what connects the event listener function to the event. Once an event listener function is registered with an event source, you can think of it as the event listener function sitting there quietly, just waiting to be told or "listening" for when the event is dispatched or announced. Once the event is announced, the event listener function will then run, enabling the Flash movie to make the appropriate response.

FLASH ACTIONSCRIPT 3 EVENT HANDLING SYNTAX
The syntax for writing event handling code would be:

eventSource.addEventListener(EventClass.EVENT_CONSTANT, eventListenerFunctionName);

function eventListenerFunctionName(e:EventClass):void 
{
     // code for response goes here
}

Let's create an example:

1. Create a new Flash ActionScript 3.0 document
2. Draw a shape on the stage and convert it into a Button symbol
3. Give this instance an instance name of my_btn
4. Create a new layer for the ActionScript, then select frame one of this layer
5. Go to the Actions Panel and type the following code in the Script pane:
   

   my_btn.addEventListener(MouseEvent.CLICK, onClick);
   
   function onClick(e:MouseEvent):void
   {
        trace("The event handler works!");
   }

You've just written some code that handles a mouse click event. Go ahead and test your movie. When you click on the button, you should see the phrase The event handler works! come out in the output window.

FLASH ACTIONSCRIPT 3 EVENT HANDLING CODE EXPLAINED
We've learned that there are 3 important elements when it comes to working with event handling in Flash AS3 (the event, the response, and the event source). But when it comes to writing the event handling code, the code itself is made up of 2 parts: (1) the add event listener statement, and (2) the event listener function.

ADD EVENT LISTENER STATEMENT

Whenever an ActionScript 3 event happens, the event gets dispatched or announced within the Flash player. Once the event is announced, the event listener function that is registered with the event's source will execute. To register an event listener function with an event source, the addEventListener() method is used. Registering the event listener function with the event source will enable the event listener function to know when to respond. In order for the event listener function to respond at the right time, the add event listener statement must contain the following 3 pieces of information: the event source the event the name of the event listener function to be executed once the event is triggered In the example we created, the add event listener statement would be: my_btn.addEventListener(MouseEvent.CLICK, onClick); Event Source: my_btn Event: MouseEvent.CLICK Event Listener Function Name: onClick

THE EVENT LISTENER FUNCTION

This is the function that gets executed in response to the event. The event listener function's body will contain the lines of code that will make up whatever response we'd like the Flash movie to make whenever the event is dispatched (e.g. playing a sound when a button is clicked, displaying an image when you roll over a button, etc...). In the example that we created, the event listener function would be: function onClick(e:MouseEvent):void { trace("The event handler works!"); } The event listener knows that it is the function that needs to be executed because its name matches the event listener function name that was specified in the add event listener statement. NOTE: You will also notice that the event listener function has a single parameter - e. We'll talk about that later.

At this point, let's take a look at a summary of the event and response process that took place in our code example:

1. User clicks on the my_btn button
   
   
   
   
2. The event (my_btn being clicked) is immediately dispatched
   
   
   
   
3. The event listener function "hears" the event being dispatched
   
   
   
   
4. The event listener function runs
   
   

So that is the basic flow of how events in AS3 are handled: (1) the event occurs, (2) it gets dispatched, (3) the event listener "hears" the event being dispatched, (4) and the event listener function runs.

Now let's go back to the event listener function and lets talk about the single parameter that it is set to accept. In our example, the parameter is named e and is of the MouseEvent data type.

function onClick(e:MouseEvent):void
{
     trace("The event handler works!");
}

Every time a dispatched event triggers an event listener function to run, information gets passed to that event listener function. This information is contained in what is referred to as an event object. This parameter is what is used to accept that event object whenever it gets passed to the event listener function. Some of the information contained in this event object include: the event source and the event that occurred.

All event listener functions must always have a parameter for the event object regardless of whether or not the parameter will be used anywhere in the function body. In our example, we do not make use of the event object parameter, but if we removed that parameter, our event handler code will NOT work.

When creating the event object parameter, its data type is set to match the event class of the event that is being watched out for. In our example, the event listener is watching out for a mouse click, which is under the MouseEvent class. So the data type for the parameter should be MouseEvent as well:

myObject.addEventListener(MouseEvent.CLICK, myListenerFunction);

function myListenerFunction(e:MouseEvent):void
{
     // function body
}

If we were watching out for a KeyboardEvent, then the parameter should have the KeyboardEvent data type instead:

myObject.addEventListener(KeyboardEvent.KEY_DOWN, myListenerFunction);

function myListenerFunction(e:KeyboardEvent):void
{
     // function body
}

In the examples, the parameter name used is e. It's NOT a requirement that you use the name e, since parameter names are author defined. The usage of e is more of a common convention, and is what will be used throughout this tutorial series.

In the next part of this series on Flash AS3 event handling, we are going to take a closer look at the AS3 event object.

PREV: Introduction to Flash AS3 Event Handling
NEXT: The AS3 Event Object

Introduction to AS3 Event Handling - Learn All About AS3 Event Listeners

Part 1: Introduction to AS3 event handling
Part 2: How to create an AS3 event listener
Part 3: The AS3 event object
by Alberto Medalla
Lecturer, Ateneo de Manila University

In this series of articles, we're going to learn all about the basics of Flash AS3 event handling. This first part will introduce to you the concept of events within Flash and how these events can be handled throughout a Flash movie or application. Let's begin.

ActionScript code inside a Flash movie or application only gets executed after specific events occur. Let's say we have Event A, Event B and Event C - some parts of the code will run only after Event A happens (whatever that event may be), while other parts of the code will wait for either Event B or Event C. Now, I know the word "event" can sound a bit dramatic. Are we talking about a catastrophic event? A mysterious event? Or an explosive event, perhaps? Not really. This simply means that the various blocks of code in a Flash movie wait for specific things to happen - events - before they respond. They don't just get executed all at the same time. Let's say, for example, you have a Flash space fighter game. And in this game, your character is a small spaceship that shoots lasers, and your enemy is a giant mother ship. Your task is to keep firing at this mother ship until you break down its force field so that you can then destroy the entire mother ship altogether. Destroy the mother ship before it destroys you, and achieve this goal before your time runs out.

So in this game, you'll have some code that controls the firing of the lasers, while some other part of your code will enable the user to control the movement of your spaceship. And then you'll have more code that will control the energy of the enemy mother ship's force field, code for the game's time limit, code for the scoring, and so on... Now, obviously, you don't want all of that code to just keep running all at the same time. For instance, the code that creates the time limit should run immediately when the game begins, while the code for firing the lasers should run only when the user presses the space bar on the keyboard. Here, you see that there is an event and a response. An event would be something that happens while the Flash movie or application is running. That event could be anything - a user clicking on a button or an image being downloaded, for example. A response would be how the Flash movie or application would react after a specific event occurs. That response could be anything as well - play an audio file, go to the next frame, display some text, etc... In the 2 previous examples, the events would be: (1) the starting of the game, and (2) the user pressing the space bar key. The respective responses would be: (1) the starting of the counter for the time limit, and (2) the firing of the lasers.

Event	Response
Game starts	Time limit starts running
User presses space bar	Lasers are fired

Let's take a look at an actual example. In the image below, you will see that there is some ActionScript on the keyframe on the last frame of the Flash movie.

This last frame contains a stop() action, which will prevent the animation from looping when it reaches the end.

And since this stop() action is placed in the last frame, then it only gets executed once the playhead reaches that last frame. Not the first frame, not the middle frame, not any other frame except for the last one. So the event that Flash is waiting for in this example would be: the moment that the playhead enters the last frame. While the response would be: the Flash animation stops.

Event	Response
Playhead enters last frame	Flash animation stops

If, for example, we wanted to stop the animation on frame 25 instead, then we should place the stop() action on a keyframe on frame 25.

So the event that invokes the response here would be: the playhead entering frame 25 (instead of the playhead entering the last frame).

But this is a rather simple example. Here, the event that we are waiting for is simply dependent on the movement of the playhead along the frames of our animation. We just have to write the code, run the movie, and then wait for the playhead to enter the frames that contain ActionScript code.

But what about other types of events? 
Let's take user-based events, for example. User-based events are those that are initiated directly by the user, such as a mouse click or a keyboard press. In the space fighter game example, the user pressing the spacebar key is considered a user-based event. Whenever the user presses the spacebar, the spaceship fires its lasers. So whatever code in the Flash movie is responsible for shooting the lasers should be executed only when the user-based event of pressing the spacebar key happens. And then there are also other types of events other than user-based events that occur while the Flash movie is running. For example, when an external image is loaded into a Flash movie, the moment the loading of the image finishes can be considered as an event as well.

So how do we write ActionScript code that will allow us to identify a specific event and then tell Flash to respond only after that event occurs?
The process of identifying events and telling Flash how to respond is referred to as event handling. In order for you to be able to handle events in Flash, you must write what is called an event listener. An event listener is a function that will execute only when the specified event occurs (a mouse click, a press of a keyboard key, etc...). In order for an event listener to know the right moment at which to execute, it must be registered to an event's source. It's quite common to have numerous event listeners in one Flash project in order to deal with the many different events that can happen while the Flash movie is running. This is one of the reasons why AS3 event handling is one of the most important things that you should get a good grasp of when you are starting to learn ActionScript 3.

In the next article, we're going to learn how to write an ActionScript 3 event listener and how to register it to an event's source.

NEXT: How to Create AS3 Event Listeners

Adding Sound to Flash Movie Timeline and Choosing Flash Sync Sound Options - Flash Event Sound vs Flash Stream Sound Tutorial

This tutorial comes with exercise files. Click the link below to visit the download page:
[GO TO EXERCISE FILES DOWNLOAD PAGE]

In this Flash Sound tutorial, we'll be learning the basics of adding sound to Flash documents. Here, I'll show you how to add sound to the timeline of a Flash movie. We'll also be taking a closer look at 2 of the Adobe Flash Sync Sound options - Flash Event Sound vs Flash Stream Sound. These are options that allow you to control the synchronization of sound in your Flash movie and we'll take a look at the difference between the two.

Open the add-bg-music.fla file. This is just a simple 16-second Flash animation of a jumping stickman. Take a look at the timeline and you will see a layer called bgmusic. This is where we will be placing the sound for our Flash movie. You'll see that the layer has one blank keyframe and nothing else.

NOTE: You DO NOT need a dedicated layer for your audio in Flash. You can place the sound on a layer that also has some animation in it. But even if creating a dedicated layer for your sound is not required, I would still recommend that you do so, in order to keep things more organized within your Flash document.

To add sound to Flash documents, let's first import the audio file. Import the CheerfulSong.mp3 file into the Flash document by choosing File > Import > Import to Library. Navigate to where the file is on your hard drive and import it. Once it's imported, select the blank keyframe on frame 1 of the bgmusic layer. A keyframe is needed in order to place sound on a layer in the timeline.

Next, go to the Properties Inspector. Here, you should now see the frame properties. Under the SOUND heading, click on the Name drop-down menu in order to expand the list. Whenever you import an audio file into your Flash document's library, it automatically gets added to this list. You should see CheerfulSong.mp3 as the second option.

Go ahead and select it. This applies the audio to our selected keyframe.

Take a moment to look at the other properties under the sound heading. You'll see Effect and Sync.

The Effect menu let's you choose from a few basic effects that you can apply to the selected sound.

Sync is short for synchronization. The Sync options let you choose the type of synchronization that the selected sound should follow: Event, Start, Stop or Stream. You can also instruct the sound to play more than once by specifying a Repeat value greater than one, or by choosing the Loop option.

When adding sound to Flash, the synchronization options will affect how the sound behaves when it is playing. Let's take a closer look at 2 of the synchronization options - Event and Stream.

Let's try to understand the difference between those two:

Event - This synchronizes the sound in your Flash movie to an event. That event would be when the playhead enters the frame that contains the sound. Once the playhead enters that frame, the sound will start playing and will only stop when the sound is explicitly told to stop (e.g. using ActionScript code that will stop the sound). Even if the animation is already at the end, an Event sound will keep on playing until it is explicitly told to stop (or until the song reaches the end).

Stream - This synchronizes the audio to the frames of the Flash movie. When the Flash movie stops, so does the sound. Also, when there are no more frames in the layer that contains the sound, then the sound will stop playing as well, even if the other layers still have frames to play.

Let's choose the Event option first and let's see how it will work in this example. But before you test the movie, let me explain what will happen: First, you need to know that the CheerfulSong.mp3 audio file is about 30 seconds long, while the Flash animation of the jumping stickman is only 16 seconds long. So our song is almost twice as long as the animation. And also, by default, a Flash animation is going to loop. This means that when the playhead reaches the last frame, it will go back to frame 1 and play the animation again, and so on... And since the animation is shorter than the song's duration, this means that the animation will loop back even before the song reaches its end. It's important that you understand this because when you preview this animation with the Event sound, you will notice that when the Flash animation loops, the same sound will play again, but the previous instance of the sound will still continue playing. So you'll end up with two instances of the song playing on top of each other. This happens because an Event sound will play every time the playhead enters the frame that contains that sound. When the animation loops, the playhead enters the frame with that sound once again, and therefore, another instance of the song is played as well. But we also know that an Event sound will not stop unless you explicitly tell it to stop. That's why the first instance of the sound will still continue playing along with the new instance of the sound. This will keep happening as long as the animation keeps looping and the Event sound is NOT explicitly told to stop. In cases where the sound is much, much longer than the looping animation, you'll end up with not just two instances of the sound playing on top of each other, but more! So go ahead and choose the Event option and then test the movie to verify what happens.

NOTE: The Start option behaves similar to the Event option in that it waits for an event (the playhead entering the frame where the sound is placed), but it differs in that the Start option will NOT play the sound again while the previous instance is still playing.

Now let's go back to the Flash document, and let's change the Sync option to Stream so we can understand how it will make the sound behave in this example. But before you test the movie, let me tell you that you will NOT hear the sound playing. We'll have to fix one more thing first to make the sound work properly. But in the meantime, go ahead and test the movie to verify, and then continue reading the article.

So now that you've tested the movie, let me explain why we don't hear the sound playing: The reason why you don't hear the sound playing is because there is only one frame on the layer where we placed the sound. If you recall, the Stream option will synchronize the sound to the frames of the animation. And right now, the sound is only being synchronized to one frame. That's not enough. So in order to hear the sound, we'll need to add more frames. Let's do that. Select the empty slot for frame 193 on the bgmusic layer, then right-click on it and choose Insert FRAME in order to add more frames to the layer. So now that there are more frames on the bgmusic layer, you should be able to hear the sound. Go ahead and test the movie to verify. You will notice that whenever the animation loops, the previous instance of the sound stops playing and the new instance starts from the beginning. And again, that's because the sound is being synchronized with the frames of the animation whenever the Stream option is used.

So when should I choose Event and when should I choose Stream?
Well, it really depends on what you're trying to do in your Flash movie. But as a general rule, I choose Stream whenever I need the sound to be in sync with the animation. I choose Event when I need to have a sound play regardless of how many frames I may have in the animation (for example if I'd like a song to keep playing even though the animation has already reached the end). But as you've seen in the example, this can be quite tricky because Event sounds can end up playing on top of each other. So in some cases I will just choose the Start sync option or I would add some ActionScript to make sure that the sound plays the way I want it to. With Button symbols, however, when you want to add sound inside a Button symbol's timeline (e.g. a sound effect whenever the user clicks on it), you must use the Event option. Button symbols' timelines only have a limited number of frames (just 4 to be exact), so most likely, the Stream option won't play the sound properly in this case.

Adding sound to Flash is fairly simple. It's usually with the way the sound behaves when playing where most new Flash users have a little trouble with. Hopefully, this tutorial has made it a bit more clear for those of you who are just learning how to add sound to Flash movies.

PREVIOUS: Flash Sound Basics | Adding Sound to Flash Movies - Importing Audio Files into a Flash Document's Library

Flash Sound Tutorial | How to Add Sound to Flash Movies - Importing Audio Files into a Flash Document's Library

In this beginner's Flash sound tutorial, we're going to talk about the basics of how to add sound in Flash. Adding sound to your Flash projects can make them a little more interesting. You can use audio files to add voice over narrations, background music and sound effects, for example. One way of being able to work with sound using Flash is by importing the sound files into your Flash document. Some of the audio formats that Flash gives you the ability to import include, but are not limited to:

• MP3
• WAV
• AIFF

NOTE: Working with audio in Flash can take up a lot of resources. You might want to consider working with MP3 files over WAV and AIFF files since MP3 files are compressed and will take up less disk space. Also, if you won't be using the entire audio file, you might want to create a shorter version of the audio file using an audio editing application, and use that shortened version instead. This will help save more disk space.

To be able to add sound to the timeline of your Flash movie, import the audio file into your Flash document first. Here's how:

1. From the main menu, choose File > Import > Import to Library
   
2. When the Import to Library dialog box comes up, navigate to the folder that contains the audio file, select the file, and click on Open
   
3. Once Flash finishes importing the file, you should be able to see it in the Flash document's library
   

You can preview the audio file by selecting it in the library, and then clicking on the play button in the preview window.

In the next article, we're going to learn how to add imported audio files to a Flash document's timeline. That article is also going to talk about the difference between the Flash Event Sound and the Flash Stream Sound options - two options for synchronizing sound in Flash.

NEXT: Adding Sound to Flash Movie Timeline and Choosing Flash Sync Sound Options - Flash Event Sound vs Flash Stream Sound

Flash 8 Masking Effect | How to Create a Mask in Flash 8 Video Tutorials

In this series of Macromedia Flash 8 video tutorial clips, we'll show you how to create a Flash 8 Masking effect. A Flash 8 mask layer can be used to hide some portions of a layer underneath it, revealing only select areas. It's pretty simple and easy to learn, but there are a number of different, creative ways to make use of a mask in flash.

Part 1: Working with Flash 8 Masking - What is a Layer Mask?

In part 1, we'll show you a simple example that demonstrates the Flash 8 masking effect.
[ALTERNATE LINK]

Part 2: Working with Flash 8 Masking - Creating the Layer that will be Masked

NOTE: If you're working in Flash CS5 and you're having trouble finding the Static Text type option, make sure that in the Properties Inspector (while you have the Text Tool selected), you have Classic Text instead of TLF Text selected.

In part 2 of Working with Flash 8 Masking, we'll be creating the layer that will be masked. This layer will consist of some text.
[ALTERNATE LINK]

Part 3: Working with Flash 8 Masking - Creating the Animation in the Mask Layer

NOTE: If you're following along with this video, but you're working in Flash CS5, choose Create Classic Tween instead of Create Motion Tween.

In part 3 of Working with Flash 8 Masking, we will be creating the motion tween animation in the layer that we will use as the mask. The motion tween animation will consist of a circle that moves from the left to the right side of the stage.
[ALTERNATE LINK]

Part 4: Working with Flash 8 Masking - Converting a Layer into a Mask

In part 4 of Working with Flash 8 Masking, we'll show you how to convert a regular layer into a layer mask.
[ALTERNATE LINK]

Part 5: Working with Flash 8 Masking - Editing a Layer Mask

In part 5 of Working with Flash 8 Masking, we'll show you how to edit an already existing layer mask.
[ALTERNATE LINK]

Flash ActionScript 3 Tutorials - Beginners

ActionScript is a programming language used to develop applications that will run on the Adobe Flash Player platform. In this page, you'll find a list of beginner's level ActionScript 3 tutorials that will help you understand how to use the ActionScript 3 language to add interactivity to your Flash movies. If you're a Flash designer or animator who is looking to expand your skills in Flash by learning ActionScript 3, I encourage you to browse through these articles, and hope that you will learn a few new things. The lessons are grouped into different categories, which include topics such as Flash AS3 Event Handling, Working with Sound in AS3, and Creating ActionScript 3 Preloaders to name a few. This page is also updated whenever new tutorials are available. And to provide a more hands-on approach to learning, some lessons come with exercise files as well, which you can download for free and work with as you read the articles. So if you're ready to learn ActionScript 3, start reading the lessons and get on track to becoming knowledgeable in this powerful programming language. Have fun learning ActionScript 3!

Introduction to AS3

Assigning Instance Names and Modifying some Movie Clip Properties in AS3
Introduction to Flash AS3 Variables
Expressions and Operators in ActionScript 3

Flash AS3 Events

Introduction to Flash AS3 Event Handling
How to Create an AS3 Event Listener
The AS3 Event Object
Using the AS3 EnterFrame Event to Create Coded Animation in Flash

Working with MovieClips

The AS3 'this' keyword and how to randomize the size of a MovieClip instance on the stage
Enabling Users to Drag and Drop MovieClips
Testing Collision Between Two MoveClips

Flash ActionScript 3.0 Preloader Tutorial

Preloading in Flash AS3 [PART 1]
Preloading in Flash AS3 [PART 2]

Working with the Flash ActionScript 3.0 Timer Class

Introduction to the Flash ActionScript 3 Timer Class

Working with Text in Flash AS3

AS3 TextFields - The Basics
Working with AS3 Input Text Fields
Formatting Text in AS3
ActionScript 3 String to Number Conversion
ActionScript 3 Number to String Conversion
Enabling the User to Submit the Contents Inside an Input Text Field
[PART 1] Working with External Text in Flash ActionScript 3 - Loading the Text
[PART 2] Working with External Text in Flash ActionScript 3 - Formatting the Text
[PART 3] Working with External Text in Flash ActionScript 3 - Scrolling the Text

Working with Sound in Flash ActionScript 3

Introduction to the AS3 Sound and SoundChannel Classes
Playing Sound from the Library and Making a Sound Clip Loop in AS3
Pausing and Resuming Sound using Flash AS3
Flash AS3 Volume Controls

Working with Arrays in Flash ActionScript 3.0

Creating a Simple Quiz Game with Flash AS3 [PART 1]
Creating a Simple Quiz Game with Flash AS3 [PART 2]
Creating Multiple TextFields and Arranging their Positions using Arrays and For Loops in AS3
Retrieving the Index Value of an Item in a Flash AS3 Array

Working with the Flash AS3 Tween Class

The Flash AS3 Tween Class - Introduction
Flash AS3 Tween Events

Miscellaneous Flash AS3 Topics

Passing Custom Parameters to Flash ActionScript 3 Event Handlers
How to Fix the Error #1009 Preloading Issue in Flash AS3
Flash AS3 Stage Focus and Keyboard Event Issue and How to Remove the Yellow Border around Objects in Focus
AS3 Random Numbers Generator

Are you also interested in learning Python?

Check out these Python 3 Tutorials for Absolute Beginners. Featured ActionScript 3 Video Tutorial

Animating an Object Using the AS3 Enter Frame Event

Featured ActionScript 3 Training Courses
If you're looking for more ActionScript 3 training, check out these great training courses from lynda.com. Click on the links below to learn more about the courses, and to watch some free sample videos. If you want free access to all of the videos in these courses, you can sign-up for a free 10-day trial pass. Lynda.com is a great site for software training, and I use it myself so that I can stay updated on the latest training courses for Adobe products, and more.

ActionScript 3.0 Training by

• ActionScript 3.0 in Flash Professional CS5 Essential Training
• Flash Professional CS5: Code Snippets and Templates in Depth
• Flash Professional CS5: Creating a Simple Game for Android Devices
• Flash Professional CS5: Creating a Simple Game for iOS Devices

START LEARNING TODAY!


10-day free trial

Thank you for visiting our Flash ActionScript 3 Tutorials for Beginners page. Like us on Facebook if you enjoyed this page, and feel free to share this with others who might be interested. We hope you visit us again! :)

Flash 8 Motion Tween Video Tutorials | The Basics of Motion Tweening - Animating Position, Color, Size and Using the Easing Property

In this set of Macromedia Flash tutorial online video training clips, we'll show you the basics of Motion Tweens in Macromedia Flash 8. In these tutorials, you'll learn how to animate the following properties of an object: position - make an object move from one side of the stage to the other, color - make the object change in color as the animation happens, size - change the scale of an object over time. You'll also learn how to use the Flash 8 easing property of motion tweens. This will give you greater control over the motion tween's speed. You can make the movement of objects accelerate or decelerate using the Flash 8 easing property.

NOTE: If you're working in Flash CS5, choose CREATE CLASSIC TWEEN instead of Create Motion Tween when you follow along with the videos.

Part 1: Working with Motion Tweens in Flash 8 - Animating an Object's Position

In this video, we demonstrate a basic Flash 8 motion tween example - how to animate an object's position.
[ALTERNATE LINK]

Part 2: Working with Motion Tweens in Flash 8 - Animating 2 Objects at the Same Time

In part 2 of Working with Motion Tweens in Flash 8, we show you how to properly animate 2 different objects at the same time. We'll also show you how you can reuse the media assets in your Flash document's library.
[ALTERNATE LINK]

Part 3: Working with Motion Tweens in Flash 8 - The Easing Property

NOTE: If you're working in Flash CS5, the Ease property can be found in the Properties Inspector (while a frame is selected) under Tweening.

In part 3 of Working with Motion Tweens in Flash 8, we talk about the Flash 8 easing property of motion tweens. The easing property allows you to adjust the distribution of the speed of an animation. With the easing property, you can make motion tweens accelerate or decelerate.
[ALTERNATE LINK]

Part 4: Working with Motion Tweens in Flash 8 - Animating Color

NOTE: If you're working in Flash CS5, the Tint property can be found in the Properties Inspector (while a symbol instance is selected) in the Style menu under Color Effect.

In part 4 of Working with Motion Tweens in Flash 8, we'll teach you how to animate an object's color. In this example, we'll make one of the circle's change color over time.
[ALTERNATE LINK]

Part 5: Working with Motion Tweens in Flash 8 - Animating an Object's Size

In Part 5 of Working with Motion Tweens in Flash 8, we'll teach you how to scale or resize an instance of a symbol using the Free Transform tool so that you can animate the object's size over time.
[ALTERNATE LINK]

Flash 8 Frame by Frame Animation and Flash 8 Onion Skin Feature Video Tutorial Series

NOTE: If you are looking for a version of this tutorial for Flash CS5, then check out Creating a Frame by Frame Animation - Flash CS5 Video Tutorials for Beginners.

In this set of Macromedia Flash tutorial online video training clips, we'll show you the basics of creating a simple frame by frame animation in Macromedia Flash 8. In these tutorials, you'll learn how to insert blank keyframes, draw using the brush tool, and you'll also learn how to use the helpful Flash 8 onion skin feature, which is a very useful tool when doing frame by frame animation in Flash 8. We'll also be explaining what the FLA and SWF file formats are.

Part 1: Flash 8 Frame-By-Frame Animation Tutorial - Introduction

Macromedia Flash 8 let's you easily create your own frame-by-frame animation. In this video, we explain how a frame by frame animation works and we show you a simple example of a Flash 8 stickman animation.
[ALTERNATE LINK]

Part 2: Flash 8 Frame-By-Frame Animation Tutorial - Drawing on the Stage

In part 2 of the Flash Frame-By-Frame Animation Tutorial for beginners series, we show you how to draw a simple stickman on the stage of your Flash document.
[ALTERNATE LINK]

Part 3: Flash 8 Frame-By-Frame Animation Tutorial - Adding Keyframes and the Onion Skin Feature

In Part 3 of this Flash 8 video training series, we'll teach you how to add keyframes and how to use the Flash 8 Onion Skin feature - a feature that let's you see a tracing guide based on the objects in previous or next keyframes.
[ALTERNATE LINK]

Part 4: Flash 8 Frame-By-Frame Animation Tutorial - Saving Your Document

Make it a habit to save your work often! It can save you from the frustration of losing all of your hard work.
[ALTERNATE LINK]

Part 5: Flash 8 Frame-By-Frame Animation Tutorial - Previewing Your Animation

In Part 5 of the Flash Frame-By-Frame Animation video tutorial series, we'll show you how to preview your animation. This video also explains what a SWF file is.
[ALTERNATE LINK]

Part 6: Flash 8 Frame-By-Frame Animation Tutorial - Adjusting the Frame Rate

In the final part of the Flash Frame-By-Frame Animation Tutorial series, we'll show you how you can adjust the frame rate of your animation.
[ALTERNATE LINK]

Flash 8 Motion Guide Animation Tutorial Video Series

This tutorial was made for Flash 8. For Flash CS5 users, check out adding a motion guide in Flash CS5.

In this Macromedia Flash 8 tutorial video training series, we'll teach you how to use the Flash 8 Motion Guide. When creating motion tween movements in Flash 8, you're not just limited to horizontal, vertical or straight diagonal directions. The Flash 8 Motion Path or Guide let's you draw a path (such as a curving path for example) that a tweened object can follow as the animation progresses. Watch these online video tutorials to learn how.

Part 1: Working with Motion Guides in Flash 8 - What is a Motion Guide?

In part 1, we talk about what a Flash 8 Motion Guide is and we show you a Flash 8 animation example of the motion guide being used.
[ALTERNATE LINK]

Part 2: Working with Motion Guides in Flash 8 - Creating the Object that will Follow the Guide

In part 2, we'll draw a circle and convert it into a graphic symbol. This will be the object that will move along the motion guide.
[ALTERNATE LINK]

Part 3: Working with Motion Guides in Flash 8 - Creating the Motion Guide

NOTE: If you're working in Flash CS5, right-click on the layer name on the timeline, then choose Add Classic Motion Guide in order to add a classic motion guide to the layer.

In part 3, we'll show you how to create a motion guide layer. On this layer, we will draw a path using the pencil tool. This path that we will draw, will be the path that our tweened object will follow.
[ALTERNATE LINK]

Part 4: Working with Motion Guides in Flash 8 - Making the Object Follow the Path

NOTE: If you're working in Flash CS5, choose Create Classic Tween instead of Create Motion Tween.

In part 4, we'll show you how to make the instance of the circle symbol follow the path.
[ALTERNATE LINK]

Part 5: Working with Motion Guides in Flash 8 - Path Drawing DON'Ts

In part 5, we give you some tips on what to avoid when drawing paths for the motion guide.
[ALTERNATE LINK]