• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Lesson 12. Nonlinear Flash Interactions > Preparing the Quicktip Movie Clip and...

Preparing the Quicktip Movie Clip and Dynamic Text Field

In this task, you'll prepare the movie clip and dynamic text fields. In the next task, when each of the elements is in place, you'll begin scripting to make them functional.

In the Library, right-click (Windows) or Control-click (Macintosh) the quickTip graphic symbol, and choose Type > Movie Clip.

This step converts the graphic symbol to a movie clip symbol. You still need to do some work with the graphic symbol, but this change alone opens up a whole new realm of possibility.

The symbol contains only a beige rounded rectangle, which defines the shape of the quicktip.

Select Frame 1 of the quicktip layer, and drag an instance of the quickTip symbol anywhere onto the stage.

The positioning doesn't matter because this movie clip will be invisible when it's loaded, and when it is visible, the same script that makes it visible will also position it correctly.

This small beige rounded rectangle forms the outline of the quicktip pop-up window. Its substance will be provided by text loaded into a dynamic text field. But at the moment, the movie clip has no dynamic text field.

Double-click the quickTip instance (it has no instance name yet) to open it in Symbol-editing mode. Select Frame 1 of the text layer. Click on the stage once just to set the focus back to the stage. Select the Text tool, and change its settings in the Property inspector to Verdana, Size 11, Black. Also in the Property inspector, set the Text Type to Dynamic Text. Hold down the Shift key, and drag a text field that fits snugly inside the beige rounded rectangle, three lines high.


Insert dummy text, if necessary, to help you position it correctly.

Holding down the Shift key ensures that the dynamic text field is exactly tall enough to fit whole lines of text, at the specified size.

The first group of text settings—font, size, and so on—are familiar to you, since they are universal to just about any application that handles text. But the most important setting here is unique to Flash: the Dynamic Text setting. By choosing Dynamic Text as the Text Type, you make the text field available to ActionScript.

With the text field still selected, in the Property inspector, give the text box an instance name of quickTip_txt. Set the Line Type to Multiline. Select the Render Text as HTML option.

Again, the instance name is how you will identify this text field via ActionScript. As its name suggests, the Multiline setting enables the text inside the text field to wrap.

The other setting, Render Text as HTML, enables Flash to interpret basic HTML tags and format the text accordingly. For example, consider the following text string: my <b>bold</b> text. If Render Text as HTML is toggled off, the dynamic text field displays “my <b>bold</b> text.” If Render Text as HTML is toggled on, the Dynamic Text field displays “my bold text.” In other words, Render Text as HTML enables you to control character-level formatting in Dynamic Text fields.

Choose Edit > Edit Document to return to the main document, leaving Symbol-editing mode.

When you leave, the new symbol is saved in the Library, and all placed instances (in this case, just one) are also updated.

Select the quickTip instance, and give it an instance name of quickTip_mc.

The quickTip_txt dynamic text field is located inside this movie clip instance. When you reference variables inside of movie clips from ActionScript that is outside the movie clip (such as a script on the main timeline), you need to specify which movie clip instance's variable you are setting. To do so, you reference it with its instance name.

In this step, you are creating the instance name that will enable you to change the variable inside the quickTip instance from buttons on the main timeline. You'll actually write such a script in the next task.



Not a subscriber?

Start A Free Trial

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint