Flash AS3 Tutorials Center | Interesting Flash Animation Tutorials | Valuing Flash Animation Tutorials | Flash ActionScript and Animation Home

AS3 Beginner Tutorials | AS3 Basic Lessons | AS3 Valuing Courses | AS3 Components Tutorials | AS3 and PHP Interaction Tutorials
AS3 Practical Tutorials | AS3 Animation Techniques | AS3 Transition Effects Tutorials | AS3 Download Upload Files | AS3 Particle Systems
Communication Between Flash Movies with AS3 | AS3 and JavaScript interaction | AS3 Matrix Transformation | AS3 Physics Simulation Tutorials

Flash TextArea Component ActionScript 3 Tutorial

This Flash Component tutorial series show how to use TextArea with Flash ActionScript 3.

Please update flash player to view this Flash ActionScript tutorial!

Flash Tutorial Content:

The Flash TextArea component is a multiline text field with a border and optional scroll bars. The TextArea component supports the HTML rendering capabilities of Adobe Flash Player.

The finished Flash Movie of this tutorial is shown as above. Click on the above Flash Movie and play around.

Flash ActionScript Codes:

//Create a new loader to load the text file
var myURLLoader = new URLLoader();

//Specify the data format
myURLLoader.dataFormat = URLLoaderDataFormat.TEXT;

//Load the text file (story.txt)
myURLLoader.load(new URLRequest("story.txt"));

//Set the Text Format of the TextArea (story_ta)
var textAreaFormat:TextFormat = new TextFormat("Arial", 14, 0x3333FF);
story_ta.setStyle("textFormat", textAreaFormat);

//Listen to when the loading COMPLETE
myURLLoader.addEventListener(Event.COMPLETE, loadTextFile);


function loadTextFile(evt:Event) {

//Already set in the Parameters window
//story_ta.wordWrap = true;

//Load the text file to TextArea
//replace double empty line with a single empty line
story_ta.text = evt.target.data.replace(/\r/g,"");



// Allow Text Fields to input data
inputText_txt.type = TextFieldType.INPUT;

//Allow wordWrap
inputText_txt.wordWrap = true;

//Set the New Paragraph RadioButton to be selected by default
newParagraph_rb.selected = true;

//Declare the Radio group (belong to same group)
//This can be done by using the first RadioButton (newParagraph_rb)
var textRadioGroup:Object = newParagraph_rb.group;

//Add event listener to the Enter button
enter_btn.addEventListener(MouseEvent.CLICK, appendText);


function appendText(evt:MouseEvent):void {

// Check if data are entered in the text field
if (inputText_txt.text == "") {
output_txt.text = "Field is Empty!";} else {if (String(textRadioGroup.selectedData) == "New Paragraph") {//Append text with New Paragraph to TextArea
story_ta.appendText("\n\n"+ inputText_txt.text);
} else {
//Append text to End of TextArea
story_ta.appendText(" "+ inputText_txt.text);
}//Keep the scroll at the bottom
story_ta.verticalScrollPosition = story_ta.maxVerticalScrollPosition;

//Clear inputText_txt
inputText_txt.text = "";


Download Flash Source File:

Flash Source File textarea.fla


This Flash ActionScript tutorial shows how to use Flash TextArea component.