Loading External Text in Flash CS3

I've been out of the Flash game for quite a while now. The last version I've been using was Flash MX. Imagine my surprise when I downloaded Flash CS3 and found that it now uses purely Actionscript 3.0. All my previous methods of programming Flash were rendered useless by all the new standards. Alas, I began my quest to find useful information, and hit a few roadblocks.

Adobe's livedocs are ok, but it really helps to find real world examples. I tried searching for the various things I needed, but to no avail. I finally found some screencasts on youtube that helped, so I got my problem solved. It was at that point that I decided to write my own articles to help people achieve specific tasks using Flash, PHP, DHTML, and whatever else I can come up with.

Now, enough of my Rant. Lets code!

So my main task for this article is to load an external file into a flash app, and display it in a text box. This is specifically good for loading text that will be changed periodically. Rather than open flash, edit the file, re-publish, and upload the new file, you can just pull all the data from a txt file and display it there. We can even render the text as HTML!

We'll build this app using the TextArea component. Just go to Window->Components to pull up the components window. Drag a TextArea component to the stage, and give it an instance name. We'll call ours external_faq.

Now for the code. I'll give the code, and then I'll go ahead and explain it. All of the following code goes in the timeline on the same frame as the objects it references.

var faqLoader:URLLoader = new URLLoader(); // Step 1
faqLoader.load(new URLRequest("test.txt")); // Step 2

faqLoader.addEventListener(Event.COMPLETE, onComplete); // Step 3

function onComplete (event:Event):void // Step 4
{
var faq:String = event.target.data; // Step 5
external_faq.text += faq; // Step 6
}

Step 1
We need to make a new URLLoader, so we define the variable faqLoader as a URLLoader, then call a new URLLoader() object. The URLLoader will hold the data returned by the URL.

Step 2
We go ahead and load the url, using the URLRequest() object. We use the load method of the URLLoader object, and open a new URLRequest object, which contains the path to our text file. Simple enough.

Step 3
Now we go ahead and add an Event Listener to our faqLoader to listen for when the loading as been complete. An event listener is the equivalent of using an "onWhatever" event with older Action Script. There are many different Event Listeners and Event types. For instance you could have an event:MouseEvent and check for when MouseEvent.CLICK occurs to see when a user clicks their mouse on the object the code is attached to. That's getting on a tangent though.

Step 4
We set a String variable to hold the text that is loaded from the file. This will enable us to do any string manipulation we may wish to do. However, we're going to keep this one simple, and just display the text to the TextArea component.

Step 5
Finally, we set the text property of the TextArea component to our String variable. Note that we I am not using external_faq.text = faq. I am using external_faq.text += faq. Also, if you wanted to use html formatted text, you would use the htmlText property.

Finally, the text file that you have written doesn't need any variables inside it. All it needs to contain is the text you wish to display.

I hope this tutorial is useful for anybody who had the same trouble I did. I know it's a relatively simple application, but making that migration from Actionscript versions can be tough.

On a shameless side note, if you liked the article and found it to be useful, click on an add or two at the top of this page. I'm a starving college student after all, and every little bit helps. :-D

~Koz