The Best Structure for your Flash Site - Page 2
       by Mark Angeletti  |  16 June 2006

Let's examine each frame one by one.

Frame 1
Frame 1 is always -- and only -- used for setting global variables. This works well, as the playhead hits this frame first, sets our globals and moves on to the next frame. We never return to frame 1, ever. It's important always to control the Flash playhead and know where it's located at all times. Now, let's look at the code:

var xmlFile:String = "navigation.xml";
var cssFile:String = "navigation.css";
var nCounter:Number = 0;
var yPosition:Number = 0;
var nTotalButtons:Number = 0;
var astrImages:Array = new Array();
var astrText:Array = new Array();
var astrLinks:Array = new Array();
var image_mcl:MovieClipLoader = new MovieClipLoader();
var mclListener:Object = new Object();
// Formats our textField
var my_css = new TextField.StyleSheet();
// fun with filters (new in Flash 8)
import flash.filters.DropShadowFilter;
var distance:Number = 2;
var angleInDegrees:Number = 45;
var color:Number = 0x000000;
var alpha:Number = .8;
var blurX:Number = 2;
var blurY:Number = 2;
var strength:Number = 1;
var quality:Number = 3;
var inner:Boolean = false;
var knockout:Boolean = false;
var hideObject:Boolean = false;
var filter:DropShadowFilter = new DropShadowFilter(distance, angleInDegrees, color, alpha, blurX, blurY, strength, quality, inner, knockout, hideObject);
var filterArray:Array = new Array();

Here we see our global variables: some strings, some numbers, and some arrays -- your typical variables. But, wait. Some not-so-typical variables are also present: a MovieClipLoader, a StyleSheet and a Filter.

The MovieClipLoader class allows us to implement listener callbacks that provide status information while SWF, JPEG, GIF, and PNG files are being loaded into movie clips. This is a lot handier than the dated loadMovie() class, which failed to provide us with any information on how much of our file had already been downloaded. We'll use the MovieClipLoader class later to load our button image.

The StyleSheet class lets you create a StyleSheet object that contains text formatting rules for font size, color, and other styles. We'll use this StyleSheet in frame 4 to format the text on our navigation buttons.

Filters are new to Flash 8; they allow us to add some cool effects to our objects. For example, we can apply drop shadows, blurs, glows and bevels to objects. We'll apply the drop shadow filter to our text field later. Some will say, "Big deal. If I want a drop shadow I could use Photoshop or Fireworks for that." You could, but then your text would no longer be dynamic, as ours is.

Keep in mind that all the components that make up our Flash site don't reside in Flash. Perhaps I should have used an exclamation point instead of a period for that last sentence? Let me say it again, "All the components that make up our Flash site don't reside in Flash!" This approach allows for easy modification later. If, for example, I no longer like the image chosen for my buttons and I want to swap it out, that's no problem. Or maybe I want to have the button say something different, or perhaps I want to add or remove a button later. Neither will be a problem; in fact, I won't even have to open Flash to make these changes. That's very handy indeed, especially when you're creating a project for someone who doesn't have Flash, or much in the way of technical knowledge.

Before we move on to frame 2, notice our 3 arrays. These arrays will store the data for our buttons. Once our XML file has been parsed successfully, each array will be filled in with the proper data. This happens in frame 2.

1 | 2 | 3 | 4 | 5 | 6 | 7

SUPPORTERS:'s fast and reliable hosting provided by Media Temple.