Book HomeActionScript: The Definitive GuideSearch this book

Chapter 18. On-Screen Text Fields

Contents:

Dynamic Text Fields
User-Input Text Fields
Text Field Options
Text Field Properties
HTML Support
Working with Text Field Selections
Empty Text Fields and the for-in Statement
Onward!

Because Flash is fundamentally a visual environment, movies often present on-screen information to users. Similarly, because Flash is an interactive environment, movies often retrieve information from users through a GUI. To display the value of a variable on screen or to allow a user to type data into a Flash movie, we use text fields.

Text fields provide a means of both setting and retrieving the values of variables that have a visual representation. Text fields come in two varieties -- dynamic text fields, which we use to display information to the user, and user-input text fields, which we use to retrieve information from the user.

18.1. Dynamic Text Fields

A dynamic text field is like a variable viewport -- it displays the value of a specified variable as a text string. Dynamic text fields are created using the Text tool in Flash. However, unlike regular static text, the content of a dynamic text field is connected to a variable and can be changed or retrieved via ActionScript.

By retrieving a text field's value, we can capture on-screen information for use in a script. By setting a text field's value, we cause that value to display on screen.

18.1.1. Creating a Dynamic Text Field

To make a new dynamic text field, follow these steps:

  1. Select the Text tool.

  2. Click and drag a rectangle on the Stage. The outline that you create will define the size of the new text field.

  3. Select Text Options. The Text Options panel appears.

  4. In the Text Type menu, choose Dynamic Text (the other options are Static Text and Input Text).

  5. Under Variable, type a name for the dynamic text field, following the rules we learned in Chapter 2, "Variables", for constructing legal variable names.

After creating a dynamic text field, you'd normally set the new field's options, as described later.

18.1.2. Changing the Content of a Dynamic Text Field

Once a text field is created, we can use it to display a value on the screen. For example, if we create a dynamic text field named myText, we can set the content of that text field using the following statements:

myText = 10;                       // Display a number in the text field myText
myText = "Welcome to my web site"; // Display a string instead

var msg = "Please make a selection";
myText = msg;                      // Display the value of msg in myText

Whenever the value of the variable myText changes, the content of the myText dynamic text field updates to reflect the change. However, before a value is sent to a dynamic text field for display, it is first converted to a string. The actual content is therefore governed by string-conversion rules described in Table 3-2.

Like normal variables, text fields are tied to the movie clip timeline on which they reside. To access a dynamic text field in a remote movie clip timeline, we use the techniques described in Chapter 2, "Variables" under Section 2.5.6, "Accessing Variables on Different Timelines".

18.1.3. Retrieving the Value of a Dynamic Text Field

We can retrieve a dynamic text field's value by simply using its name. For example, if myTextField were a dynamic text field in our movie, we could retrieve and assign its value to another variable like so:

welcomeMessage = myTextField;

Text field assignment and retrieval are often combined in one statement. You can use the += operator to append text to a text field's current contents:

// Set a text field's value
myTextField = "Today's Headlines...";
// Create a new message
var newText = "Update! The Party Has Been Cancelled!"
// Add the new message to the existing text field content
myTextField += newText;


Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.