Search Flex Components Free

Custom Search

December 10, 2007

Runtime Flash CS3/Flex Integration via SWF9 files

Using the or mx.controls.SWFLoader classes it is easy to load any SWF file into a Flex application for display. The problems begin when you want to use these assets at runtime and dynamically load SWF files containing custom MovieClips/Variables/Methods/Etc. This is possible but you must do some prep work to avoid 2 problems:

1. Dynamic access to the loaded SWF file!
2. A loaded SWF can only create class instances within itself!

Once you address these two issues, you can really take the gloves off with dynamically loaded libraries and SWF content.

1. Dynamic access to the loaded SWF file

The first problem is easy, to access methods/properties within a loaded SWF you simply need to make the calls dynamic from Flex so that they compile properly. The Flex compiler wants to know in advance that methods in the loaded SWF file are present and will not let you compile otherwise given that the SWFLoader.content returns a DisplayObject by default. The key is forcing the compiler to evaluate member access into the loaded SWF as dynamic vs the strongly typed value of DisplayObject.

Here is an example:

//Create a loader to load a SWF into.
var myLoader:Loader = new Loader();

//Load a SWF into the loader
myLoader.load( new URLRequest( 'custom.swf' ) );

//after the SWF has loaded

//Cast the 'content' property as a MovieClip
//call the getInstance method defined in Frame 1 of my CS3 AS3 SWF file
//note the use of casting via MovieClip at the SWF boundary

Here is the same code without type casting, since .content returns a DisplayObject the compiler complains because there is no 'getInstance' method on a DisplayObject:

In this case the Flex compiler will throw the following error:
"1061: Call to a possibly undefined method getInstance through a reference with static type flash.display:DisplayObject"

Once access to the loaded SWF file is dynamic you are free to call any method or property.

2. A loaded SWF can only create class instances within itself!

The second problem is that Flash Player will only allow a SWF to create instances within itself. The instances can be passed anywhere in the player but the constructor must be called within the scope of the loaded SWF file. Using a Factory-like method we can create a method within the loaded SWF to provide instances to the parent Flex/AS3 application. This is very handy because it allows us to make the interface to generating instances simple. I use a method called 'getInstance" and pass a string that correlates to the class name. In the example below, I simply return a new MovieClip instance when this method is called and create different MovieClips depending on what is requested. The parent Flex app can save these as variables and use them as it wants.

The example below loads a SWF file (cards.swf) containing all the card designs in a deck of cards and instances are created and passed to the parent Flex application. Since the SWF was made in CS3, I was able to design the cards look and feel easily and can provide an FLA to any designer to enhance these.

Runtime Playing Cards

Runtime Playing Cards Source

Once you pass these two hurdles you can seamlessly integrate dynamically loaded SWF graphics and AS3 libraries into any part of your Flex application at runtime. Let the mayhem begin!

Related Flex Tutorials