Design Patterns

Design Patterns in Flash

As Flash developers, sometimes it is counter-productive by simply copying patterns from other languages or environments. Identifying unique Flash patterns is probably more important, because Flash is unique in many ways.

When talking about patterns, the purpose is to identify common problems and provide named solutions for them, so that developers can communicate easily without coming up with different explanations.

Patterns can be in code, or it can be in other forms. For example, here’s one I use for many different applications, which I call an Event Mask:

Problem: When a custom-made dialog box pops up, mouse and keyboard events must not be passed to underlying objects.

Solution: Create a movieclip (either during authoring time or dynamically at runtime), assign mouse and keyboard event handlers to it, turn off its hand cursor, and display it under/with the dialog box.

This is a very simple pattern that I use all the time. It is unique to Flash because of the way movieclips and events work. Luckily, this is now handled automatically in Flash MX 2004 (such as the Alert component).

A common architectural framework (although some refer to it as pattern) is MVC. One of its benefits is to separate the logic from the user interface; however, many Flash developers find that it is overkill in Flash, again, because of the way Flash work. For example, the timeline, movieclips, and UI components already represent most of the view and controller. Breaking the code up further into three classes may complicate the development process. However, the same may not hold true on a different scale in client-server applications. By keeping the three classes separate, different views can be created more easily (e.g. Flash, HTML for desktop browsers, HTML for handheld devices, XML, WAP, PDF…etc.)

What are your most used patterns in Flash development? Have you identified any pattern that you use on a regular basis, but there is no name for it?

ActionScript Design Patterns OOP Tips & Tricks


Here’s one way to implement a Singleton in ActionScript 2.0:

class Singleton {
	// the only instance of this class
	private static var inst:Singleton;

	// keep count of the number of Singleton objects referenced
	private static var refCount:Number = 0;

	// constructor is private
	private function Singleton() {}

	// get an instance of the class
	public static function get instance():Singleton {
		if (inst == null) inst = new Singleton();
			return inst;

		// return the number of instance references
		public static function get referenceCount():Number {
		return refCount;

The count property is for keeping count of the number of Singleton objects referenced (obviously it is not aware of destroyed objects), and is not really a necessary member of the Singleton pattern.

To use this class, one would write something like this:

var s1:Singleton = Singleton.instance;
var s2:Singleton = Singleton.instance;

Now s1 and s2 are the same instance of the Singleton class.