| If you've been keeping
up with the articles here on Des/Dev, you've probably read the
excellent article
by Sean Corfield on using design patterns with Flash Remoting
and ColdFusion MX. If you haven't read that article yet, make
sure you do! Sean's article explains how to utilize abstract solutions
(known as design patterns) in order to solve common programming
problems.
A pattern doesn't exist in code form. It's really just some text
that explains the type of problem it solves and (in a language
neutral manner) how to implement the pattern to solve the problem.
Patterns are very powerful—they can save you a lot of time
and agony. Patterns simply help you from having to reinvent the
wheel.
So why am I telling you all this? Because some of the simple
types of patterns can be easily applied to your ActionScript code
right now. This is important, because despite their simple nature,
these patterns will increase the power and flexibility of your
code.
Value Object pattern
Sean mentioned this pattern in his article, but it can also be
applied to straight ActionScript development as well. The central
idea behind the Value Object pattern is consolidation of method
calls.
For example, it's common for objects to have a number of getter/setter
methods in order to insert and retrieve data from the object.
While such systems work well, they do so at the expense of function
calls - setting 5 properties would take 5 separate function calls.
While this approach might not present a problem, it is clunky
in straight Flash development. (Conversely, if you were making
the calls through Flash Remoting, this approach could be a real
problem—in terms of bandwidth waste).
The Value Object pattern solves this problem by proposing the
creation of "value objects" whose sole purpose is to
pack multiple properties into a single object. You can do this
easily in Flash by utilizing anonymous objects. For example, {name:"Branden",
age:23} will create an object with two properties, name and age.
Here's a before and after:
Before:
userData.setName(name_txt.text); userData.setAddress(address_txt.text);
userData.setCity(city_txt.text); userData.setState(state_cb.getSelectedItem().data);
userData.setZip(zip_txt.text);
After:
userData.setInfo({name:name_txt.text, address:address_txt.text,
city:city_txt.text, state:state_cb.getSelectedItem().data,
zip:zip_txt.text});
The setInfo method of the userData object just has to dig into
the object it was passed and set its properties accordingly.
The Value Object pattern is often used in conjunction with the
facade pattern—see Sean's article for more details.
Observer pattern
Another pattern that comes in quite handy in Macromedia Flash
development (in fact you probably already use it!) is the Observer
pattern. The idea behind the Observer pattern is to allow multiple
objects to "observe" another object and hence be notified about
changes to the object they are observing.
This pattern is used by all of the objects in Flash that support
the addListener and removeListener methods. One such object is
Key. Multiple objects can easily "observe" Key just by calling
Key's addListener method, then registering themselves as an observer.
Later, the "observers" just need to define methods to handle the
different events the Key object broadcasts.
This code makes the Foo object observe the Key object:
foo = new Object();
foo.onKeyDown = function(){
trace("Foo saw a key go down!");
}
Key.addListener(foo);
Strategy pattern
The final pattern I'm going to cover in this article is the Strategy
pattern. The idea behind the Strategy pattern is to define the
rules for how to solve a particular problem, but not actually
solve the problem itself. This allows you to swap out "strategies"
whenever you like. The Strategy pattern is useful to implement
whenever you know you'll need to solve a particular problem in
a number of ways, but want to make sure it's easy to switch between
different solutions.
Java's GUI library, Swing, relies on the pattern for its layout
manager code. Rather than just providing a single way of laying
out and aligning UI elements, Swing provides the rules for how
a layout manager works. If you build an application with Swing,
you have to specify the layout manager you want to use. You could
easily create a set of Flash objects to act in a similar manner,
to allow you to align movie clips:
Here's the method you would add to the movie clip object:
Movieclip.prototype.align = function(min,
max, AlignManager){ AlignManager.align(this, min,
max);
}
Here's a simple alignManager:
LeftAlignManager = new Object();
LeftAlignManager.align = function(obj, min, max){
var current = 0;
for (var c in obj){
if (typeof(obj[c]) == "movieclip"){
obj[c]._x = current;
current += obj[x]._width + 2;
}
}
}
And here's a sample call:
foo_mc.align(0, 300, LeftAlignManager);
Conclusion
As you can see, design patterns are quite powerful and can help
you write better ActionScript faster—by giving you techniques
for solving common problems. If you are interested in patterns,
just search on the Internet, there are many out there! Also, for
a good introduction to using patterns in real development, check
out "The
Joy of Patterns" by Brandon Goldfedder.
|