Using variables in a project

When you build animations or applications with Flash, there are very few situations in which you don't need to use any kind of variable in your project. For example, if you build a login system, you might need variables to determine whether the user name and password are valid, or whether they are filled in at all.

You can find more information on loading variables (such as name/value pairs) in Working with External Data.

In the following example, you use variables to store the path of an image you are loading with the Loader class, a variable for the instance of the Loader class, and a couple of functions that are called depending on whether the file is successfully loaded or not.

To use variables in a project:

Create a new Flash document, and save it as imgloader.fla.

Select Frame 1 of the Timeline, and add the following ActionScript to the Actions panel:

/* Specify default image in case there wasn't a value passed using FlashVars. */
var imgUrl:String = "http://www.helpexamples.com/flash/images/image1.jpg";
if (_level0.imgURL != undefined) {
    // If image was specified, overwrite default value.
    imgUrl = _level0.imgURL;
}

this.createEmptyMovieClip("img_mc", 10);
var mclListener:Object = new Object();
mclListener.onLoadInit = function(target_mc:MovieClip):Void {
    target_mc._x = (Stage.width - target_mc._width) / 2;
    target_mc._y = (Stage.height - target_mc._height) / 2;
}
mclListener.onLoadError = function(target_mc:MovieClip):Void {
    target_mc.createTextField("error_txt", 1, 0, 0, 100, 20);
    target_mc.error_txt.autoSize = "left";
    target_mc.error_txt.text = "Error downloading specified image;\n\t" + target_mc._url;
}
var myMCL:MovieClipLoader = new MovieClipLoader();
myMCL.addListener(mclListener);
myMCL.loadClip(imgUrl, img_mc);

The first line of code specifies the image that you want to dynamically load into your Flash document. Next, you check whether a new value for imgURL was specified using FlashVars or URL-encoded variables. If a new value was specified, the default image URL is overwritten with the new value. For information on using URL variables, see Using variables from the URL. For information on FlashVars, see Using FlashVars in an application.

The next couple of lines of code define the MovieClip instance, and a Listener object for the future MovieClipLoader instance. The MovieClipLoader's Listener object defines two event handlers, onLoadInit and onLoadError. The handlers are invoked when the image successfully loads and initializes on the Stage, or if the image fails to load. Then you create a MovieClipLoader instance, and use the addListener() method to add the previously defined listener object to the MovieClipLoader. Finally, the image is downloaded and triggered when you call the MovieClipLoader.loadClip() method, which specifies the image file to load and the target movie clip to load the image into.

Select Control > Test Movie to test the document.

Because you're testing the Flash document in the authoring tool, no value for imgUrl will be passed by FlashVars or along the URL, and therefore the default image displays.

Save the Flash document and select File > Publish to publish the file as a SWF and HTML document.

NOTE

Make sure that Flash and HTML are both selected in the Publish Settings dialog box. Select File > Publish Settings and then click the Formats tab. Then, select both options.

If you test your document in the Flash tool (select Control > Test Movie) or in a local browser (File > Publish Preview > HTML), you will see that the image centers itself both vertically and horizontally on the Stage.

Edit the generated HTML document in an editor (such as Dreamweaver or Notepad), and modify the default HTML to match the following text:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.adobe.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="550" height="400" id="imgloader" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="imgloader.swf" />
<param name="FlashVars" value="imgURL=http://www.helpexamples.com/flash/images/image2.jpg">
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="imgloader.swf" quality="high" FlashVars="imgURL=http://www.helpexamples.com/flash/images/image2.jpg" bgcolor="#ffffff" width="550" height="400" name="imgloader" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />
</object>

Test the HTML document to see the changes. An image that you specify in the HTML code appears in the SWF file.

To modify this example to use your own images, you would modify the FlashVars value (the string inside the double quotes).

Flash CS3