INFORMATION

Formatting Externally Loaded Text In Flash ActionScript 3 0

This article is a continuation of the Loading External Text Files In Flash ActionScript 3.0 tutorial. In this lesson, well be using a TextFormat object to style our externally loaded text. So lets go back to the code and create the ff:

• a TextFormat object (lets name it textStyle)
• some text formatting properties (lets change the font and the size)

var myTextField:TextField = new TextField();
var textURL:URLRequest = new URLRequest("summer.txt");
var textLoader:URLLoader = new URLLoader();

// This next line creates the TextFormat object which will be used to
// change the text formatting
var textStyle:TextFormat = new TextFormat();

addChild(myTextField);

// Add in some formatting properties using the TextFormat object.
// Lets change the font to Verdana and the size to 14
textStyle.font = "Verdana";
textStyle.size = 14;

myTextField.border = true;
myTextField.multiline = true;
myTextField.wordWrap = true;
myTextField.width = 215;
myTextField.height = 225;
myTextField.x = 300;
myTextField. y = 50;

After creating the TextFormat object and setting some properties, well then need to apply the TextFormat object to our TextField. Otherwise, we wont see any formatting changes. To assign the TextFormat object to the TextField, well use the setTextFormat() method of the TextField class. The TextFormat object is passed to this method as a parameter. Thats how it gets assigned to a specific TextField. Also, the setTextFormat() method must be used only after the text has been assigned to the TextField and not before. So in this example, well need to add this inside the displayText function, right after the line that says myTextField.text = e.target.data; .

function displayText(e:Event):void 
{
     myTextField.text = e.target.data;
     // This next line assigns the textStyle TextFormat object
     // to the TextField with the instance name myTextField
     myTextField.setTextFormat(textStyle); 
}

So now, if you test the movie, you should see the formatting changes applied to the text.

Heres the code in full:

import flash.text.TextField;
import flash.net.URLRequest;
import flash.net.URLLoader;
import flash.text.TextFormat;

var myTextField:TextField = new TextField();
var textURL:URLRequest = new URLRequest("summer.txt");
var textLoader:URLLoader = new URLLoader();
var textStyle:TextFormat = new TextFormat();

addChild(myTextField);

textStyle.font = "Verdana";
textStyle.size = 14;

myTextField.border = true;
myTextField.multiline = true;
myTextField.wordWrap = true;
myTextField.width = 215;
myTextField.height = 225;
myTextField.x = 300;
myTextField. y = 50;

textLoader.addEventListener(Event.COMPLETE, displayText);

function displayText(e:Event):void 
{
     myTextField.text = e.target.data;
     myTextField.setTextFormat(textStyle);
}

textLoader.load(textURL);

Youll also notice that all the text does not fit inside the TextField anymore (since we made the font size larger). In the next part, well fix this by learning how to add a scrolling functionality for our TextField.

PREV: Loading External Text Files In Flash ActionScript 3.0
NEXT: Completing The Project: Adding Text Scrolling