Friday, March 13, 2009

CHAPTER 1 - Load dynamic text at runtime

In the lesson Adding and Editing Text, you practiced typing text directly on the Stage. You can also design your movie to include text from external files. One of the easiest ways to accomplish this is to use the loadVariables action to load text from a text file into a dynamic text field at runtime. In the FLA file, you can specify text attributes, such as font style, size, and color, for the dynamic text field. An advantage of keeping text in external files is that anyone who wants to modify the text can work with the text file rather than the FLA file.

In this section, you’ll learn how to accomplish the following tasks:

• Import and align a logo
• Create a dynamic text field
• Use the Property inspector to assign a text variable name
• Use the loadVariables action to load text from an external file

To complete this section, you can either continue to work on your mystiletto.fla file, or you can browse to your Flash MX application folder and open Tutorials/FlashIntro/stiletto4.fla. If you do use the stiletto4.fla file, save the file with a new name in your My_Stiletto folder to maintain an unadulterated version of the original file.

Import the logo

Before creating the dynamic text field, you’ll import the logo, a Macromedia FreeHand file for which Flash automatically adds a layer on the Timeline.

1 In the Timeline, select the Images layer and add a new layer above it. Name the new layer Copy.

2 With the Copy layer selected, choose File > Import. Earlier in the tutorial, you imported objects into the library. Now you’ll import the logo so that it appears on the Stage.

3 Browse within your Flash MX application folder to the Tutorials/FlashIntro/Assets folder and click logo.fh10, then click Open.

4 In the FreeHand Import dialog box, verify that Scenes, Layers, and All are selected. Also verify that Include Background Layer and Maintain Text Blocks is selected, and then click OK.

















5 In the Timeline, Flash created a layer named Logo. Drag the Logo name to move the layer below the Copy layer.

6 You can specify Stage coordinates for the logo. In the Property inspector, with the logo selected, type 10 in the X text box and 20 in the Y text box. Then press Enter or Return.

7 In the Timeline, lock the Logo layer.









Create a dynamic text field


Now you’ll create a dynamic text field. Instead of typing text into the field, you’ll specify the variable text that loads into the field at runtime.

1 In the Timeline, select the Copy layer. In the toolbox, select the Text tool. In the Property inspector, select Dynamic Text from the Text Type pop-up menu.

2 In the Font pop-up menu, select _sans. _sans is a device font appropriate for small text that appears on multiple computer platforms. For more information about device fonts, see “Using device fonts (horizontal text only),” under Help > Using Flash.

3 In the Point Size text box, type 12. 4 Click the Text (fill) Color box and select yellow, with a hexadecimal value of FFCC00.

5 In the Line Type pop-up menu, select Multiline, which is for multiple lines of text that will wrap.


Text Type pop-up menu









..............
Line Type pop-up menu


6 On the Stage, click below the logo. Drag the pointer to create a text field the width of the logo text and the approximate depth of the vertical line that’s grouped with the logo, as shown in the following illustration.









7 In the Property inspector, type textField in the Var text box.




The text file that will load into the dynamic text field, as seen in the following illustration, includes text that names the variable: textField=. When you enter this name in the Var text box, you are naming the variable that the movie should load.













Use the loadVariables action to load text

The loadVariables action includes a parameter to specify the path to the variable text. The text is in a file named copy.txt, within your Tutorials/FlashIntro/Assets folder.

1 In the Timeline, add a new layer and name it Actions. If necessary, drag the Actions layer to the top of the Timeline.

A good practice is to keep actions on the top layer in a Timeline.

2 If the Actions panel is not open, choose Window > Actions. Enlarge the Actions panel, if necessary, by clicking the white arrow in the title bar to expand the window, and by dragging the lower right corner of the panel to view the Actions toolbox and Script pane.

The type of Actions panel that is displayed depends on the object to which you’re adding an action. If you’ve selected a frame, for example, the Actions panel displays actions for frames. If you’ve selected a button, the Actions panel displays actions for buttons.

3 Click the triangle in the upper right corner of the panel title bar to display the pop-up menu. Verify that normal mode, rather than expert mode, is selected.

Expert mode offers features useful to those experienced with ActionScript. In normal mode, parameter fields and controls guide you in creating ActionScript.

.......................................Options menu button


















....Actions toolbox..... Script pane




4 In the Actions toolbox, choose Actions > Browser/Network, then double-click loadVariables.

The ActionScript is added to the Script pane. Parameters for the action appear above the Script pane.

5 In the URL text box, type the path to the text file: ../assets/copy.txt.



















Test your movie


• Save your movie, then choose Control > Test movie. You can also press Control+Enter (Windows) or Command+Return (Macintosh)
.
.
==============================================
.
Contents
Trademarks
CHAPTER 1 - Introduction to Flash MX Tutorial
CHAPTER 1 - What you should know
CHAPTER 1 - View the completed movie
CHAPTER 1 - Analyze the stiletto.fla file
CHAPTER 1 - Define properties for a new document and create a ...
CHAPTER 1 - Create and mask vector art
CHAPTER 1 - Tween bitmap effects within a movie cl...
CHAPTER 1 - Load dynamic text at runtime
CHAPTER 1 - Add animation and navigation to button...
CHAPTER 1 - Add streaming and event sounds
CHAPTER 1 - Organize your Library panel
CHAPTER 1 - Test download performance and publish ...
CHAPTER 1 - The next steps
.
CHAPTER 2 - Introduction to ActionScript Tutorial
CHAPTER 2 - View a completed movie
CHAPTER 2 - Initialize the movie
CHAPTER 2 - Save and retrieve information
CHAPTER 2 - Display information in a dynamic text ...
CHAPTER 2 - Write an expression
CHAPTER 2 - Control the flow ofthe movie
CHAPTER 2 - Create commands and reuse code
CHAPTER 2 - Use a built-in object
CHAPTER 2 - Test the movie
CHAPTER 2 - The next steps
.
CHAPTER 3 - Introduction to Components Tutorial
CHAPTER 3 - Types of components
CHAPTER 3 - View the completed form
CHAPTER 3 - Create a form
CHAPTER 3 - The next steps
.
==============================================