Accessibility

Using Flash for the first time—Part 2: Adding symbols, animation, and ActionScript


Table of Contents

Adding text

You need to add some text to your banner for decorative purposes. You can add several types of text to a Flash document: static text, dynamic text, or input text. Static text is useful when you need to add decorative text to the Stage, or any text that doesn't need to change or load from an external source. Use dynamic text when you want to load text from a file or database, or change the text when the SWF file plays in Flash Player. Use input text when you want the user to type into a text field. You can take that text and send it to a database, have it manipulate something in the SWF file, and more.

You can add any of these types of text using the Text tool. For this exercise, you will add some static text to the Stage. To add static text, follow these steps:

  1. Open the banner.fla document you created in Part 1 of this tutorial, and rename the file banner2.fla.

    Note: If you didn't finish Part 1 of this tutorial, didn’t feel like reading it, or lost your file, then open the folder of the source files ZIP archive that accompanies this tutorial. Inside the start folder, find banner.fla and use this file to begin the tutorial.

  2. Choose Insert > Timeline > Layer (or click the Insert Layer button on the Timeline) to insert a new layer. Double-click the layer's name and type text to rename the layer.
  3. Select the Text tool (which looks like a large letter T) in the Tools panel.
  4. Click near the top of the Stage and type Overworked? into the field that's on the Stage.
  5. Select the text field using the Selection tool. A bounding box appears around the text when you select it.
  6. Open the Property inspector (Window > Properties > Properties) and make sure Static Text appears in the Text Type pop-up menu.
  7. Change the font of the text to whatever font you prefer. You change the font using the Font pop-up menu (next to the A icon, seen in Figure 1).
  8. Change the size of the font to 24 points using the Font Size pop-up menu, and see if it fits within the banner. You might need to change the font size until the text fits on the Stage.

     

    Property inspector

    Figure 1: Change text settings in the Property inspector until the text fits on the banner. This text has bold face and a drop shadow filter applied (using the Filters panel).

    When you finish, the text should look similar in size and position to the text in Figure 2.

    add static text

    Figure 2: Add some static text to the banner.

  9. Select the Text tool again and type Underpaid? below the text you added in Step 4.
  10. Select the text field and open the Property inspector. Change the text to the same font you selected in Step 7. Then select a font size so the text is large but still fits on the Stage.
  11. Repeat Steps 6 and 7 to add the phrase Gnome? below the previous two lines of text, and then use the Selection tool to select each text field and move them until their position resembles the text in Figure 3.

    When you finish, your banner will resemble Figure 3.

    three lines of text

    Figure 3: You should have three lines of text that resemble this image when you finish this exercise.

  12. (Optional) Open the Align panel (Window > Align) to align the text to the center of the Stage. Select a text block on the Stage, click the To Stage button in the Align panel, and then click the Align Horizontal center button. (Move the mouse over a button in the panel to see what its name is.)
  13. .
  14. Choose File > Save to save your progress before moving on.

    Tip: For advanced text effects, you can create text in Adobe Illustrator®, save the file as an AI, PNG, or SWF file, and import it into Flash.