Return to Kroll Design home page

Flash Tutorials (with .FLA files included)

« Return

ActionScript 3

Putting HTML into a text field

Use the htmlText property to assign HTML to a text field. In this example, an underlined hyperlink is added. Also, in this example a background color is added to the text field.

Download the FLA file

// Create a TextFormat object and set text alignment to CENTER:
var myFormat:TextFormat = new TextFormat();
myFormat.align = TextFormatAlign.CENTER; // this centers the text within the field

// Create a style sheet and create styles for links and non-links:
var myStyleSheet:StyleSheet = new StyleSheet();
var myNonLinkStyle:Object = new Object;
myNonLinkStyle.color = "#ffffff";
myNonLinkStyle.fontFamily = "sans-serif";
myNonLinkStyle.fontWeight = "bold";
var myLinkStyle:Object = new Object();
myLinkStyle.color = "#ffff00"; // Note that here it wants HTML style hex, not 0xff0000
myLinkStyle.fontFamily = "sans-serif";
myLinkStyle.fontWeight = "bold";
myLinkStyle.textDecoration = "underline";

// Create the text field and set its size, border, and background:
var myTextField:TextField = new TextField();
myTextField.width = 150;
myTextField.height = 30;
myTextField.border = true;
myTextField.background = true;
myTextField.backgroundColor = 0xff0000;

// Center the text field on the stage:
var xLocation = (stage.stageWidth - myTextField.width) / 2;
var yLocation = (stage.stageHeight - myTextField.height) / 2;
myTextField.x = xLocation;
myTextField.y = yLocation;

Assign the CENTER formatting to defaultTextFormat and assign the style sheet to the text field:
myTextField.defaultTextFormat = myFormat;
myTextField.styleSheet = myStyleSheet;

// Assign HTML to the text field and add the text field to the stage:
myTextField.htmlText = "<span class='non-links'>Visit </span><a target='_blank' href=''>Kroll Web Design</a>";

« Return

©2012 Kroll Design    781.910.3694
Last modified: 12/31/1969 7:00 PM