Positioning, Sizing, and Formatting a Text Field

You position and size your text field on the stage as you do other visual elements. In fact, because text fields are rectangular, it's very similar to working with a rectangle. You use the x and y properties to put the text field in a certain spot on the stage, and then you use the width and height properties to size the text field. So, the first step for the Bearcat Banner is to move away from that upper-left corner, and then give it enough width to show all the text. Here's the code you add before the addChild() statement:

tlfBanner.x = 40;
tlfBanner.y = 40;
tlfBanner.width = 220;
tlfBanner.height = 160;

Formatting the Text Field's Background and Border

In addition to positioning and sizing text fields, you can format text fields by changing their properties. For example, you can add colored backgrounds and borders for text fields. These are the same properties you change in the Properties panel using color pickers and text boxes. The difference here is that you're accessing the properties with your code. In the case of backgrounds and borders, not only do you have to set the color and size, but you also need to set the background and border properties to true so that they display something like this:

tlfBanner.borderColor = 0x993300;
tlfBanner.borderWidth = 5;
tlfBanner.background = true;
tlfBanner.backgroundColor = 0xFFFFCC;

Tip

Here's an important point to keep in mind when you're learning to work with text and ActionScript: Formatting ...

Get Flash CS5: The Missing Manual now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.