Azroc Sitemap

Using the TextArea Component in Flash:

Creating three buttons and adding a TextArea component to the stage, we can load text files into the Textarea on clicking the buttons. Click on a button to see how it works:


Open a new document in Flash:

First you need to create three buttons on your flash interface. I used the rectangle tool and rounded the corners using the round rectangle radius option at the bottom of the tools panel. I then used the text tool to draw text on top the buttons and aligned the text and rounded rectangles using the alignment panel( Ctrl + K ). I then pressed the F8 key or Modify ->Convert to symbol and created a button which I then duplicated to make 3 buttons. Then double clicking on each button you go into button design timeline. Click on the Over frame and press F6 to insert a key frame changing the colour to give an effect on mouse over. Click on the Hit frame and use the rectangle tool to define the hit area by drawing over the button.. Click on Scene 1 above the timeline to come out of editing the buttons. You may now need to duplicate each of the symbols in turn to modify each independantly. Insert keyframes on your timeline at reasonable intervals. On the properties window label the frames text1 text2 and text3. I then added a TextArea component ( Ctrl + F ). Change its dimensions in the properties panel with it selected. Finally right click on the stage and select Distribute to layers. This will put all symbols on separate layers. Set up the timeline as follows:

 

With button "Text 1" selected hit the F9 key or Windows -> Development panels -> Actions. Make sure the button is selected and not the timeline and enter the following code:

 

on (release) {
gotoAndStop("text1");//text1 is the frame label alternatively use the frame number.
}

 

Repeat this for the other buttons.

Now insert a TextArea component on frame one: Windows -> Development panels -> Components, drag the component onto the stage and resize it using the coordinates in the properties window. Also give it an instance name in the properties panel in my code below I call it textHolder. Now create a new layer by clicking the icon in the timeline window. Callit actions if you like. Then above each frame label insert a keyframe by pressing F6. Now with each new keyframe selected press F9 to launch the actions panel and paste in the following code:

 

stop();//necessary stop only in frame one so that the
// timeline does not loop continually on loading the webpage
_global.styles.TextArea.setStyle("borderStyle", "none");
_global.styles.TextArea.setStyle("fontFamily", "_serif");
thisText = new LoadVars();//creates a variable of type LoadVars
thisText.load("text1.txt");//Please note you need three different files
//text2.txt and text3.txt if you want to load different text

//into the TextArea Component

//load function in class LoadVars
//to load the source

thisText.onLoad = function(success) {//called whenever load() is called
if (success) {
textHolder.vPosition = 0;
textHolder.text = thisText.myText;
//myText is the reference at the begining
//of the text in the text file
//this line gets the reference to the text in "home.txt"
//and stores the text in the textHolder(TextArea)

}
};

Now lastly but most importantly in order to link the text in the file to the TextArea.text property( I am refering to the code: textHolder.text = thisText.myText; ) you must ensure to start the text file with the following:

 

&myText=

The text file should look like this:

 

 

Exactly like that. This allows the LoadVars class variable thisText above to link to the text in the file using the reference myText in the code and &myText in the file and store it in the text property of the TextArea component named textHolder above. I hope you got that.

eXTReMe Tracker


Links: