3.3. Preparing Text for Animation
Text is often an integral part of an animation, drawing the eye to key terms that need to stand out in the design. In the completed version of your animation, the text "Flash 8 Out of the Box" appears one section at a time, moving in from different directions. In this project, the boxes serve to initially attract the user's attention, and the animated text completes the effect. A short animation such as this one serves its purpose without being gratuitous.
When choosing a font, be sure to pick one that matches the needs of the piece. Be mindful of the fact that too many fonts can be distracting. Try to use as few fonts as are required to get the idea acrosspreferably no more than two or three. Make sure they are dissimilar enough that the user can appreciate the difference instead of merely viewing the choices as byproducts of inconsistent design.
Later, when you start using ActionScript to control text in text fields, you will learn that you must embed fonts in your file to make sure they display correctly on any machine. Reducing the number of fonts used will help to keep the .swf file size down.
Next, add the text to the movie:
You now have the text you need for your animation, but you can't animate these elements separately if they are all in one layer. To separate the text into five layers:
Note: Text, unlike other elements in a Flash movie, does not need to be converted to a symbol before a motion tween is applied to it, because Flash treats it as a symbol automatically. However, it is a good practice to convert objects on the Stage to symbols before applying a motion tween. This makes it easier to make global changes when necessary.
Figure 3-8. The new text layers, with each element converted into a symbol
3.3.1. Types of Text
The static text type is used when you don't need to change the content of the text with programming at runtime. Essentially, the type is treated like any other vector shape when compiled. This means that you can use a custom font without fear of it changing from machine to machine.
However, although the font will remain intact when compiled into a SWF by its creator, if the FLA is edited without the custom font installed, the SWF will not render as expected. Therefore, to ensure that the sample files you see on the CD-ROM match the screenshots in this bookeven if you don't have the font used in these filesthe text elements have been broken apart into vectors. They are no longer editable, but they will appear as intended.
When you're more experienced with Flash, you may want to use a custom font even when programming text content. In this case, you can opt for dynamic (programmable) or input (programmable and user-editable) text types, and embed a font in your file for use at runtime. This increases the file size but allows for more flexible and customized design possibilities.
Dynamic and input text types are assets that you can try working with later in the book, as your ActionScript skills grow.
3.3.2. Sliding Text
To complete the animation, instead of having the text resize and change colors, as you did with the boxes, you need to make each word slide onto the Stage from a different direction. To create a simple design from these elements, you can have the text on the ends slide in from the left and right edges, respectively, and you can have the text in the middle slide in from the top or bottom.
Soon, you'll tween the text animation as you did for the boxes. First, however, you need to make sure the text doesn't appear until after the box animation is finished.
To make sure the text doesn't appear until the boxes are in position:
Now, the text does not appear until the playhead reaches frame 14. The box animation completes in frame 12, and the text animation starts a few frames later for effect.
To animate the text: