Masking Dynamic Text and Device Fonts
       by Dave Collier AKA Digitalosophy: 28 April 2004

Why can't I mask dynamic text or device fonts yell's the inspiring flash developer!
It makes no sense! I can mask static text, why not dynamic text or device fonts?
Well Macromedia has a somewhat of an explanation here, but I'm going to try and explain this the best I can.

Basically you can only mask device fonts by using an actual movie clip as a mask.
You must also embed your dynamic text into a movie as well. You might not be used to this method as it's so convenient to use the timeline mask and most of the work you probably did in the past never required masking dynamic data loaded into a text field or text area. It's becoming so easy to generate external data in flash.

Here is an example of what we will create. A simple dynamic textarea with some text inside it with a mask applied to it:
 

[ an example of what you will create ]

Here is How
The following steps will explain what this tutorial will be trying to explain.

  1. Create a new flash document.

  2. Create a new layer and call it textarea.

  3. Draw a text area where you're dynamic text will be stored with your text tool.

[grab your text tool, click on the stage and draw your textarea]

 
  1. When your finished drawing the text area, open your properties panel
    and select "Dynamic Text" and "Multiline".


     
  2. Ok now we are going to convert the dynamic textarea into a movieclip . So hit F8 on your keyboard and call the movieclip main_mc.

    Also, you should embed your fonts. Click the Character button. The Character Options dialog box will appear. Check the option for Specify Ranges and select Uppercase, Lowercase, and Numerals if your data may contain numbers:



[ make sure to embed your fonts ]
 

  1. Give your movieclip and instance name of main_mc as well.

     

  2. Create an additional layer in your timeline and call it mask. Draw a box covering the main_mc movieclip with the proper dimensions.
     
  3. Again we are going to convert the box to a movieclip. So hit F8 and call our movieclip mask_mc. Also be sure to give your new movieclip an instance name of mask_mc.
     
  4. Now we just have to add some actionscript to make it all work. Create a new layer and call it actions. Click inside the 1st frame of your timeline and open your actions pallet. Type the following script into your actions panel:
     
main_mc.setMask(mask_mc);

Details about setMask:


Availability : Flash Player 6

Usage : main_mc.setMask(mask_mc)

Parameters:
main_mc The instance name of a movie clip to be masked.
mask_mc The instance name of a movie clip to be a mask.

 
Note
You should always use the actionscript dictionary as guide when using new functions. This method will also work for device fonts as well. Also search the forums on this topic, there are million's of threads regarding this. If you have questions about using text in flash check out this tutorial by Kirupa.

The following zip file contains the Flash source file used in this tutorial.

Well I hope this helps and clears up whatever questions you had about masking dynamic text and device fonts. If you have any questions be sure to visit the forums.

Until next time:

Digitalosophy

 




SUPPORTERS:

kirupa.com's fast and reliable hosting provided by Media Temple.