AS3 Tutorials - A compilation of the best ActionScript 3.0 Tutorials available online
Hi. My name is
Martin Legris and I thought that I would spend some time and create a site that offers a directory of the best resources to learn ActionScript 3 (all flavors) quickly and effectively.
I have some nice ideas for this site, and I will work on it when I get the time. For now, I started to gather content, so here is pure content (and nothing else!). If you would like to propose a tutorial, please email me
at mlegris _(at)_ newcommerce {dot} ca. Thank you!

This tutorial covers how to pass parameters to a SWF file and get access to them from ActionScript 3.
[Beginner] by Martin Legris
I think everybody who has worked with BitmapData in ActionScript knows about the 2880 pixel limitation of the Flash Player. Fortunately Adobe decided to rise this limit in Flash Player 10, I think something about 4000px.
Last week I visited the Flash Forum Conference in Cologne which was btw. great. A lot of inspiration and cool stuff. In his presentation Mario Klingemann talked about »Andre Michelle’s Huge Bitmap hack«. The basic idea is to embed or load a large png and create a BitmapData by cloning it. The same approach can be found here.
[Beginner] by Kirupa Chinnathambi
This tutorial breaks down operation order of ActionScript into three parts: object life cycle, frame execution, and events. Frame execution is central to all of these, especially when considering timeline usage in Flash. It is the repeating process through which a SWF runs, creating objects, dispatching events and rendering the screen. Though much of the focus here is given to the timeline - as generated by the Adobe Flash Professional authoring tool (Flash Pro) - much of the content can still be applied to projects with a more ActionScript-centric approach.
[Intermediate] by Trevor McCauley
Someone recently asked about "code injection" using AS3. Code injection comes from MTASC, where the byte code is added to an existing SWF. The person wanted to create a Flash 9 SWF with the Flash 9 AS3 preview IDE, and use mxmlc.exe to inject code into it.
This is not possible, but there are some equally powerful alternatives using embedding in AS3. As this whole AS3 thing is fairly new to many, I thought I'd explore it a bit and post some info.
Using the AS3 compiler, you obviously don't have a library for storing movie clips, graphics, text field, bitmaps, etc. So how do you get these into a SWF? Using the Embed tag.
[Intermediate] by Keith Peters
Although I am not a big fan of the CallLater function in Flex's UIComponent, I must admit that it is sometimes handy. Here is how you can implement your own CallLater function, this code can be incorporated inside of any class, enabling you to add functions that are called after the current thread of execution has been depleted.
[Advanced] by Martin Legris
Now the next challenge, loading fonts dynamically. Euh, well, I used to do it from a FLA, was easy. But using the Flex SDK 3.4 it seems that some things changed. After HOURS of playing around, I ended up with the following system:
- embed the font inside of a swf that contains a Main class + the font class
- create a function that will spawn textfields already using the font inside this Main class
Although this system has some limitations, it works beautifully.
[Advanced] by Martin Legris
Here’s a little experiment with loading fonts dynamically at runtime. So what’s this good for? Well let’s say you have a flash application where you want to allow users to customize the text formatting for some text box. Typically you would provide a small set of fonts which would all get embedded into the swf but this isn’t very flexible or ideal. Changing font’s or adding new one’s require rebuilding the swf. Also if only one or two fonts get used then all the other extra fonts do nothing but bloat the swf size. For this situation, it would be ideal to externalize the fonts and only load in the one’s needed.
[Professional] by David Chang
There are several things I miss about FlexBuilder…the debugger, authoring-time error checking, code assistance, and the quick compiles to name a few. But perhaps the first thing you’ll miss when just using the free Flex SDK is your basic trace output window. Initially I had written a simple Ruby script to handle tracing to a terminal window. This was fine for awhile but as some of my projects grew bigger, I wanted more control over logging.
[Professional] by David Chang
E4X is a new approach (ECMAScript specification) for working XML data that has been integrated into ActionScript 3. The default XML class now uses this implementation over that of the older XML classes. The old XML class in ActionScript 3 has been renamed to XMLDocument (flash.xml.XMLDocument). The old XMLNode class is still XMLNode (flash.xml.XMLNode).
E4X provides a simpler, more intuitive method for accessing XML content using familiar dot syntax. Instead of looping through all child nodes within your XML, you can reference elements by name and even filter nodes using simple conditions. Additionally, XML can now be written inline in ActionScript.
[Intermediate] by Trevor McCauley
Actionscript 3.0 finally introduced the powerful XML handling E4X ECMAScript for XML.
This new class introduces a new way to look at the XML strings using native actionscript objects.
You can read the full specifications of this powerful sub-language at http://www.ecma-international.org/../Ecma-357.htm
[Intermediate] by Alessandro Crugnola
In Flash Player, both the execution of ActionScript and screen rendering is handled in a single thread. In order for the screen to be rendered, all code execution must be completed. For a Flash Player SWF running at 24 frames per second, this allows all ActionScript operations run within a single frame (frame scripts, events, etc.), at most, around 42 milliseconds to complete - this not accounting for the amount of time necessary to perform the actual screen rendering which itself may vary. If the execution of a block of code requires more time, Flash Player will appear to lock up until it is finished, or, after a default timeout period, just stop executing code.
[Advanced] by Trevor McCauley
This tutorial covers the basics of using the Google Maps API for AS3. Namely:
- Dealing with Longitude and Latitude coordinates
- Setting up your API Key
- Localization
- Map Attributes
- Map Interactions
- Info Windows
[Intermediate] by Google
n this post, I will add code to identify each request uniquely, give you a class called "AbstractClient" that will handle most of the mechanics and is easily extended. The idea is to give you a base on which to build.
[Intermediate] by Martin Legris
It’s time to see how can we build a Flash Facebook application.
What we are going to do is a Flash movie to be embedded in a Facebook application, able to interact with the user by publishing notes and stories on the wall.
The first thing we need is the official Facebook Actionscript API. This library contains all we need to create a complete Facebook Flash application.
[Advanced] by Emanuele Feronato
Learn how to use the Ribbit API to make phone calls directly from your Flash and Flex applications.
[Advanced] by Lee Brimelow
Everybody is now talking about Flash 10 player and its possibilities. One of the new classes is the Shader class, which allows pixelbender scripts to be executed in Flash. You can download the Pixelbender toolkit here. To see a simple filter working click on the image below.
[Intermediate] by FlashScript.biz
Not only can Flash developers now directly manipulate bitmaps within Flash on the fly, but now, they also have complete control over a movie clip's transformations through that movie clip's transform matrix. In prior versions of Flash, that was not possible. Then, certain transformations such as skewing had to be achieved, if by ActionScript, through complicated math dealing with nested movie clips. That is now a thing of the past.
Understanding the transform matrix will be the topic of this tutorial. They are used both in manipulating movie clips, and bitmaps when dealing with the new BitmapData object. This makes understanding them quite helpful.
[Advanced] by Trevor McCauley
In this tutorial you will learn how to manipulate raw image data using the BitmapData class, how to extract colors individually and do some math on each pixel to transform it to something else.
[Advanced] by Martin Legris
This tutorial will show you how to take full advantage of the auto-completion in Flash Develop when using the function addEventListener on any IEventDispatcher.
[Advanced] by Martin Legris
As more Flash developers migrate towards using tools like Flex Builder and FDT for code editing, some of us have found that switching between the Flash IDE and Flex Builder doesn’t necessarily present the most seamless workflow. Compiling with the Flash IDE is slow and cumbersome; building an entire Flash project with code in Flex Builder doesn’t integrate nicely the designer’s workflow either. Until Flash Catalyst becomes available and magically cures all our designer-developer workflow headaches, what we need is a way to leverage each tool for what it does best, ie. the Flash IDE for drawing and layout, and Flex Builder for code.
Apache Ant is a software tool for automating software build processes implemented using the Java language. Ant uses XML to describe the build process and its dependencies, so no knowledge of Java is necessary for running Ant in your Flex Builder environment. By default the XML file is named build.xml.
As more Flash developers migrate towards using tools like Flex Builder and FDT for code editing, some of us have found that switching between the Flash IDE and Flex Builder doesn’t necessarily present the most seamless workflow. Compiling with the Flash IDE is slow and cumbersome; building an entire Flash project with code in Flex Builder doesn’t integrate nicely the designer’s workflow either. Until Flash Catalyst becomes available and magically cures all our designer-developer workflow headaches, what we need is a way to leverage each tool for what it does best, ie. the Flash IDE for drawing and layout, and Flex Builder for code.
In this series of tutorials, I will show you how to use Ant to create a workflow between the Flash IDE and Flex Builder. In Part 1 of this tutorial, we shall use Ant and JSFL to launch a FLA to publish a SWF.
[Advanced] by Yee Peng Chia
Google has released an AS3 module that enables communication directly with Google Analytics, w/o the constraints of passing through Javascript. This combined with the new Event Tracking abilities of GooAnal, makes for a very exciting combination indeed!
[Intermediate] by Martin Legris
StarUML is a free, Windows-based UML tool used for creating diagrams related to application design. There are many different kinds of diagrams that UML support, but our focus here will be on Class Diagrams. Class diagrams represent the structure of a collection of classes by showing both how they're defined (inheritance hierarchy) and how they relate to one another (associations).
[Intermediate] by Trevor McCauley
Well, I’m not here to make the case for using MVC but if you have spent enough time struggling with structuring an application so that it’s clearly represented by a set of well-defined relationships and responsibilities, you would’ve likely tried to implement some kind of MVC pattern. Now, some design pattern is certainly better none. Trouble is, every developer has his or her own approach to MVC. When a team of developers are working on the same project, things can get confusing pretty quickly if there are no common standards to adhere to.
This brings us to the PureMVC framework. Created by Cliff Hall, this framework provides a set of well-defined protocols for implementing the MVC design pattern with your application, rendering the grunt work of manually hooking up an MCV structure a thing of the past. However, great as PureMVC may be, it does not present an easy learning curve for some, especially those who are just getting started with OOP and design patterns.
[Advanced] by Yee Peng Chia
When I started to learn PureMVC (and I’m still learning), I was happy to discover that the AS3 version is accompanied by a Startup Manager. This utility isn’t part of the core PureMVC framework and has to be downloaded and installed separately, but it nicely integrates with the “PureMVC way of things”.
There’s a very well-documented sample project (Startup as Ordered) from the author of the utility, Philip Sexton. After exploring the source code of this project, I thought I give it a try and set up my own little startup sequence. Philip’s sample just simulates the asynchronous loading with the help of another utility he wrote (Asynchronous Stub), so I decided to take a more real-world scenario where an external stylesheet and an XML file are loaded before the user interface is created. Once you have understood the basic setup, it’s no big deal to extend the startup sequence by, for example, making asynchronous calls to remote services.
[Advanced] by Stefan Schmalhaus
I will explain how to play .FLV files that are hosted on a standard HTTP server, no fancy streaming. You can use pre-made components to do so, but sometimes, for whatever reason, you want to do it yourself. I wrote my first FLV playing algorithm in AS3 about 10 months ago, it has evolved since and here is the breakdown on how I make it work.
[Intermediate] by Martin Legris
This is the fourth (and most probably the last) installment of this series on playing FLV (and H.264 MP4) video in Flash from scratch.
For many of you, this might be the only post you are interested in. It will show you how to use the library.
[Intermediate] by Martin Legris
The series on Playing FLV files in AS3 was probably the most popular post on this blog. So I thought I would take it one step further: show SubTitles from an .SRT file over the FLV while it is playing.
First, you need to read this post by Jankees van Woezik. He did a great job at making a SRT parser, although; well, I wouldn't convert everything right away but rather do it on-demand; but that is a small detail.
Then you need to find yourself a SRT file. There are plenty on the internet, I took the Star Wars subtitles, changed the time a little bit, and ended up with this SRT file.
[Advanced] by Martin Legris
In the first part I only discussed the essentials for playing an FLV. Today I will show how to build a re-usable class around those basic ideas. At the end of this tutorial you will have a solid set of classes (3) that you can reuse as a base to play FLV videos in all your widgets.
[Advanced] by Martin Legris
Flash Player 10 expands greatly on the drawing API in ActionScript, more so than any other version of the Flash Player since the initial introduction of the drawing API in Flash Player 6.
Though the older APIs still exist, and to much of an extent work with the newer APIs, these new enhancements mostly render those old APIs obsolete. This is especially the case with the IGraphicsData objects which serve as data representations of all the available APIs.
[Intermediate] by Trevor McCauley
Being able to draw gradient fills programmatically is important for many reasons. Some of them are: to accomplish visually interesting gradient effects, to create gradient masks, reflections, and to use DisplacementMapFilter.
[Intermediate] by Dan Gries
We present a versatile custom AS3 RainDisplay class which allows for the creation of a variety of 2D raindrops animations. The raindrops splash upon impact with the ground. Below, we show two examples to illustrate the basic use of the RainDisplay class
[Professional] by Dan Gries
Events indicate when something happen. Clicking on a button indicates a "click" event. When an external text file loads into the Flash player, there's a "complete" event indicating that the contents of that text file have been completely read into the player.
Virtually all ActionScript is executed based on events. Whether it's an event handler used to run code when a button is clicked or just commands written on the timeline in frames (executed during the event of the Flash player displaying that frame), you're writing code that reacts to events.
[Beginner] by Trevor McCauley
This article describes the new multi-touch APIs available in Adobe Flash Player 10.1 beta and Adobe AIR 2 beta. As more platforms become multi-touch enabled, and as users increasingly expect to be able to interact with devices using touch interactions, the Flash Platform will provide developers with the easiest and most efficient way to deliver ubiquitous touch-enabled experiences.
[Intermediate] by Christian Cantrell
As mentioned, the single "controversial" part of my talk at Flash on the Beach this year was in questioning polling for input in Flash games. In truth, it was hardly controversial. No death threats. No twitter-based lynch mobs. Just that a couple of guys came up to me and politely expressed disagreement later, and we had a conversation about it. But, as said conversations were done later in the evening at the Old Ship, I thought it might be worth discussing in a clearer state of mind.
So the idea is that I said I thought it was better, i.e. more efficient, to use events for keyboard and mouse input, rather than polling. A few people have made keyboard manager classes which allow you to check which keys are down. You can then poll this class to see if the navigation / action keys you are interested in are currently down, and act accordingly. If you are doing this in the game loop, this is going to happen on every frame or interval, and to me, this does not make sense.
[Advanced] by Keith Peters
First, to use multi-touch you need to have multi-touch enabled hardware; and a multi-touch enabled OS. For the purpose of development (and it proved to be the most stable platform) I used a HP TouchSmart TX2 which quite honestly is nothing impressive except for its resistive Touch Screen that is developed by nTrig. This touchscreen reportedly supports 4 simultaneous touch points.
The Adobe demo took place on a HP TouchSmart PC. This PC reportedly supports 2 simultaneous touch points through its NextWindow technology.
[Advanced] by Martin Legris
This is the perfect, down and dirty AIR 101 Tutorial!
[Beginner] by Trevor McCauley
The AIR Update for Flash CS3 allows you more easily create, test, and distribute AIR applications in Adobe Flash CS3. If you are not creating AIR applications, or have no intention of creating AIR applications with Flash, you will not need this update. This update is also not required to produce AIR applications in Flash. However, it does make it a lot easier.
As it exists now, for example, Flash CS3 does not contain the definitions required (stored in SWC files) to identify classes and definitions that are unique to the AIR runtime. If you attempt to import or use these classes in a Flash CS3 file, you will more than likely encounter errors when you publish your SWF.
Also, if you are developing for the AIR runtime with Flash and wish to test your application, you cannot do so within the Flash authoring environment. Testing your application there only runs the SWF within Flash's native external Flash Player; it does not use AIR. This means, in order to fully test your movie, you have to first publish your SWF and then manually run it in the ADL of the AIR SDK.
[Beginner] by Trevor McCauley
One of the advantages of AIR is having complete programmatic control over application windows. This means you can create and modify windows on the fly through JavaScript or ActionScript. This tutorial will cover how you can use ActionScript to both move and resize an AIR application's window using Flash controls.
[Intermediate] by Trevor McCauley
This tutorial will make an application somewhat to Preview in that respect. Here, you will see how an AIR application can be created to accept image files using drag and drop and then individually display those images within the application window.
[Advanced] by Trevor McCauley
In case you were wondering, and I know that you were, AIR is not just another browser or an alternative stand along player for Flash movies. It is true that they run the same or similar content, but AIR is more. AIR is a complete desktop solution which uses web-based technologies for its development but goes beyond the capabilities that are currently available to them. A case in point: file association.
With AIR you can associate any file type with your AIR applications. This means, when opened, an associated file will open itself in your AIR application. This greatly streamlines your ability to work with external files when using them with AIR applications. This tutorial shows you how that can be done.
[Advanced] by Trevor McCauley
I wrote this series of articles to provide instructions and present techniques required to create ActionScript 3.0 components in Adobe Flash CS3 Professional.
For the purpose of this series, I focus on creating components modeled after the Flash CS3 User Interface components. These components all leverage shared base classes and other classes—which I refer to as the "User Interface Component Infrastructure."
[Beginner] by Jeff Kamerer
Today I will cover the subject of creating a reusable slider control which takes two bitmaps as resources. The thumb bitmap will slide on the rail bitmap. It is a very simple concept!
In fact, the code you are about to write will take ANY two images and create a slider with them. Just like magic, as long as your images make some sense ( a track and a button ), it should be golden!
[Intermediate] by Martin Legris
Well, we have the first major contribution by someone other than myself. Rashid Ghassempouri decided to revamp the color chooser to allow for a color panel popup so you can choose a color with the mouse. Actually, he added all kinds of cool options to it, but in the interest of keeping minimal minimal, I cut it back a bit.
Anyway, now you can specify "myColorChooser.popup = true;" and you'll get a default gradient color popup that you can choose just about any color from with a click of the mouse. You can also pass an instance of any display object to the "model" property, and that display object will be used as the popup. Finally, you can specify "popupAlign" as either "top" or "bottom" (ColorChooser.TOP, ColorChooser.BOTTOM), and the popup will appear in that direction.
[Intermediate] by Keith Peters
Both components have rows in common. In addition the DataGrid component has columns and headers. I often see the question how to change skins/text appearance of the components or of individual rows. As an example how can one change the row appearance after a mouseclick so that it stays. The skins are defined in the CellRenderer class and have default values. The example below shows the changes we made.
[Advanced] by FlashScript.biz
Learn how to take an ordinary slider and apply throw physics to it.
[Advanced] by Lee Brimelow
Flex is now in version 3.0, and runs on the Adobe Flash Player 9 runtime. Flex 3.0 has been such a success that Flex 4.0 has been announced for release in 2009. As a developer, getting in early and learning all you can now is a good idea -- standing out in the Flex community will soon become extremely difficult.
Developers are picking up Flex with great speed. One of the reasons for this is that Flex programming is relatively easy to learn if you're already familiar with XHTML. Of course, there's always a transition period when you're getting used to a new environment, but learning Flex won't take long!
Another drawcard is that Flex applications can be developed to run on a user's desktop thanks to the wonders of the Adobe AIR (Adobe Integrated Runtime) platform. Now you can develop and launch an RIA that runs in a web browser and as a desktop application. Deploying an application to a user's desktop with Adobe AIR is easy -- all that users need to do is click a link in the web browser to install the AIR runtime and your RIA on their machine. Now that's quick deployment!
[Beginner] by Rhys Tague
Learn how to use the Flex framework to create a simple Twitter search application.
[Intermediate] by Lee Brimelow
In part 2 we create a custom Flex component and use it as an item renderer for the List control.
[Intermediate] by Lee Brimelow
A tutorial that covers the basic usage of the Tween package called Tweener.
[Intermediate] by Dominic Gélineau
Animating with code may seem intimidating at first, but don't worry - you'll get the hang of it quickly. The GreenSock Tweening Platform was engineered to make it simple and intuitive. For now, we'll focus on getting you up and running with the core engine, TweenLite, and then we'll discuss if and when you might want to put the other tools to work for you (like TweenMax, TimelineLite, TimelineMax, etc.).
[Intermediate] by Jack Doyle
I wanted to try something fun with Flash this week, so I did a quick search for “Flash Physics Engine.” Lo and behold, I struck gold. Box2DFlashAS3 is an open source ActionScript 3.0 conversion of the C++ Physics Engine Box2D. I’m very impressed with its well coded structure and easily implemented nature. I learned a few new things that will change how I code forever just by reading through their example files.
[Advanced] by Clickpop Media
TweenNano is a super-lightweight (1.6k in AS3 and 2k in AS2) version of TweenLite and is only recommended for situations where you absolutely cannot afford the extra 3.1k (4.7k total) that the normal TweenLite engine would cost and your project doesn't require any plugins. Normally, it is much better to use TweenLite because of the additional flexibility it provides via plugins and its compatibility with TimelineLite and TimelineMax.
[Advanced] by Jack Doyle
-] 3D [-
In a previous tutorial (Creating a Papervision Base Template) we created a base Papervision template that we could re-use. Now however Papervision includes a form of this base template called BasicView.as
With just a few lines of code you're up and running.
[Intermediate] by Charles Schulze
In Papervision for the most part you have objects (planes, cubes, cones, 3D Models, etc) and then you have the textures or materials that you add to these objects. Think of it as getting a brand new iPhone and then buying a case or skin for that iPhone. We are essentially doing the same thing in principle - we have our object a cone (iPhone) and a material a bitmapMaterial (iPhone skin).
[Intermediate] by Charles Schulze
It’s time to create a rope with Box2d.
To start defining a rope, we’ll start from something similar: a chain. A chain is a series of two or more connected links. The smaller and closer the links, the more flexible the chain. So we can define a rope as a “perfect chain”, with infinite links.
In a Box2D simulation, ropes as we know them aren’t possible. But we can construct chains, and according to the number of links they can approximate a rope quite well.
Obviously, the higher the number of links, the more accurate the simulation, the slowest and CPU intensive the simulation.
[Advanced] by Emanuele Feronato