It’s amazing how easy it is to forget the little niches in programming languages after going almost a year without using them. I recently had the pleasure of working on an ActionScript 2 project after almost a year of doing primarily ActionScript 3 development. This post will highlight a few things that can make ActionScript 2 development a bit more like 3. I’ll also provide links to resources that helped get me back in the mindset of AS2.
Event dispatching.
One of the toughest parts of going back to AS2 is the event handling. AS3 does this much better and one of my co-workers (@rexeisen) sent me this great link: AS3 Style Events in AS2
Singleton design pattern.
I found a great PDF outlining how to implement the singleton design pattern using AS2: Singleton Design Patter with AS2
My singleton implementation:
import com.cb.Utils.messaging.*;
import com.cb.events.Event;
import mx.utils.Delegate;
class com.sierrabravo.Utils.messaging.MessageManager
{
private static var instance:MessageManager;
private var _container:MovieClip;
private var _currentContent:MovieClip;
private var _tint:MovieClip;
private function MessageManager()
{
// Do nothing
}
public static function getInstance():MessageManager
{
if(MessageManager.instance == null)
{
MessageManager.instance = new MessageManager();
}
return MessageManager.instance;
}
public function setParent(parentClip:MovieClip):Void
{
_container = parentClip;
}
public function updatePosition():Void
{
if(_currentContent){
_currentContent._x = (Stage.width - _currentContent._width) / 2;
_currentContent._y = (Stage.height - _currentContent._height) / 2;
}
if(_tint){
_tint._width = Stage.width;
_tint._height = Stage.height;
}
}
public function addMessageWindowContent(contentWindow:MessageContentBase):Void
{
tint();
_currentContent = _container.createEmptyMovieClip( "content", _container.getNextHighestDepth() );
contentWindow.init( _currentContent );
_currentContent._x = (Stage.width - _currentContent._width) / 2;
_currentContent._y = (Stage.height - _currentContent._height) / 2;
contentWindow.addEventListener(Event.CLOSE, Delegate.create( this, closeWindow ));
}
public function closeWindow():Void
{
trace('close window');
_currentContent.removeMovieClip();
clearTint();
}
public function clearTint():Void
{
_tint.removeMovieClip();
}
public function tint():Void
{
_tint = _container.createEmptyMovieClip("rectangles", _container.getNextHighestDepth());
_tint.beginFill(0x000000, 50);
_tint.lineStyle(1, 0x000033, 100);
_tint.moveTo(0, 0);
_tint.lineTo(Stage.width, 0);
_tint.lineTo(Stage.width, Stage.height);
_tint.lineTo(0, Stage.height);
_tint.endFill();
_tint.onRelease = function(){
//DO NOTHING
}
_tint.useHandCursor = false;
}
}
Preventing click through.
In the above example the screen is tinted to put focus on the pop up window. Unfortunately, even though there is a movie clip on top of everything else, it does not prevent interaction with the elements layered below it. In order to get around this I added an onRelease to the _tint movie clip along with a useHandCursor of false. This prevents interaction with elements below the tint. Here is the link to where I found this solution: Disable “Click-Through” on MovieClips in Flash
Debugging in ActionScript 2.
For the project we were working on it was not possible to use the built in debugger for Flash. Another great opportunity to use the Singleton design patter to include a trace window that can have text dumped out from any part of the application.
class com.cb.Utils.debug.Debugger
{
private static var instance:Debugger;
private var _textField:TextField;
private var _parentClip:MovieClip;
private function Debugger()
{
// Do nothing
}
public static function getInstance():Debugger
{
if(Debugger.instance == null)
{
Debugger.instance = new Debugger();
}
return Debugger.instance;
}
public function init(myText:TextField, parentClip:MovieClip):Void
{
_textField = myText;
_textField.wordWrap = true;
_textField.background = true;
_textField.border = true;
_textField.multiline = true;
_parentClip = parentClip;
}
public function output(myString:String):Void
{
if(_textField) {
_textField.swapDepths(_parentClip.getNextHighestDepth());
_textField.text += myString + "\n";
}
}
}
XML parsing.
Parsing XML is a key part of AS2 and AS3. I found a great tutorial on Loading XML data in Flash using ActionScript 2. This is my code for parsing XML.
public function init(clip:MovieClip):Void
{
example_xml = new XML();
example_xml.ignoreWhite = true;
example_xml.load("xml/BookDefinition.xml");
example_xml.onLoad = Delegate.create(this, onLoadEvent);
}
function onLoadEvent(success:Boolean):Void {
if (success) {
var myImage = example_xml.firstChild.firstChild.childNodes;
for (var i = 0; i<myImage.length; i++) {
var pageNumber:Number = parseInt(myImage[i].childNodes[0].firstChild);
var imageURL:String = myImage[i].childNodes[1].firstChild;
var keywords:String = myImage[i].childNodes[2].firstChild.toString().toLowerCase();
}
}
}
<book>
<pages>
<page>
<pageNumber>1</pageNumber>
<pageFlash>thumbnails/page01.jpg</pageFlash>
<pageText>This is page 1.</pageText>k
</page>
<page>
<pageNumber>2</pageNumber>
<pageImage>thumbnails/page02.jpg</pageImage>
<pageText>This is page 2.</pageText>
</page>
</pages>
</book>
Delegate functions.
Notice above that a delegate function was used to keep the scope of the function with the current class. More information on delegate functions can be found here: The Delegate Class
That’s it for now. I know that I’ll be using this post as a reference the next time I have to jump on another AS2 project. Being able to use design patterns, event dispatching, and debugging actually made coding in AS2 fun! Enjoy.
Additional resources.
http://www.flashmobileblog.com/tag/flash-lite-31/
http://www.adobe.com/products/flashlite/features/