View comments | RSS feed

Flash CS3 Documentation 
Programming ActionScript 3.0 > Working with text > Advanced text rendering

Advanced text rendering

ActionScript 3.0 provides a variety of classes in the flash.text package to control the properties of displayed text, including embedded fonts, anti-aliasing settings, alpha channel control, and other specific settings. The ActionScript 3.0 Language and Components Reference provides detailed descriptions of these classes and properties, including the CSMSettings, Font, and TextRenderer classes.

Subtopics

Using embedded fonts
Controlling sharpness, thickness, and anti-aliasing

Using embedded fonts

When you specify a specific font for a TextField in your application, Flash Player will look for a device font (a font that resides on the user's computer) with the same name. If it doesn't find that font on the user's system, or if the user has a slightly different version of a font with that name, the text display could look very different from what you intend.

To make sure the user sees exactly the right font, you can embed that font in your application's SWF file. Embedded fonts have a number of benefits:

The biggest limitation to using embedded fonts is that they increase the file size or download size of your application.

The exact method of embedding a font file into your application's SWF file varies according to your development environment. <updated: 6/19/2007>

Once you have embedded a font you can make sure a TextField uses the correct embedded font:

Embedding a font in Flash

The Flash authoring tool lets you embed almost any font you have installed on your system, including TrueType fonts and Type 1 Postscript fonts.

There are many ways to embed fonts in a Flash application, including:

For more details about how to embed fonts in Flash applications, see "Embedded fonts for dynamic or input text fields" in Using Flash.

Controlling sharpness, thickness, and anti-aliasing

By default, Flash Player determines the settings for text display controls like sharpness, thickness, and anti-aliasing as text resizes, changes color, or is displayed on various backgrounds. In some cases, like when you have very small or very large text, or text on a variety of unique backgrounds, you may want to maintain your own control over these settings. You can override the Flash Player settings using the flash.text.TextRenderer class and its associated classes, like the CSMSettings class. These classes give you precise control over the rendering quality of embedded text. For more information about embedded fonts, see Using embedded fonts.

NOTE

 

The flash.text.TextField.antiAliasType property must have the value AntiAliasType.ADVANCED in order for you to set the sharpness, thickness, or the gridFitType property, or to use the TextRenderer.setAdvancedAntiAliasingTable() method. [Removed phrase incorrectly identifying the default antiAliasType value as ADVANCED. The correct default value is NORMAL: 4/26/07]

The following example applies custom continuous stroke modulation (CSM) properties and formatting to displayed text using an embedded font called myFont. When the user clicks on the displayed text, Flash Player applies the custom settings:

var format:TextFormat = new TextFormat();
format.color = 0x336699;
format.size = 48;
format.font = "myFont";

var myText:TextField = new TextField();
myText.embedFonts = true;
myText.autoSize = TextFieldAutoSize.LEFT;
myText.antiAliasType = AntiAliasType.ADVANCED;
myText.defaultTextFormat = format;
myText.selectable = false;
myText.mouseEnabled = true;
myText.text = "Hello World";
addChild(myText);
myText.addEventListener(MouseEvent.CLICK, clickHandler);

function clickHandler(event:Event):void
{
    var myAntiAliasSettings = new CSMSettings(48, 0.8, -0.8);
    var myAliasTable:Array = new Array(myAntiAliasSettings);
    TextRenderer.setAdvancedAntiAliasingTable("myFont", FontStyle.ITALIC, TextColorType.DARK_COLOR, myAliasTable);
}

Flash CS3


Comments


djtechwriter said on Apr 23, 2007 at 4:24 PM :
Due to a bug in the Flash Player the CSMSettings class currently does not work, so this example will not work.
seven[hr] said on Jun 7, 2007 at 3:27 AM :
Regarding font embedding in Flash CS3 IDE. This is not documented, or if it is it's really burried somewhere very deep in help files.

if you export your font to the library and give it a name, Flash IDE never renames your font. In fact, if you selected Bitmap Text during the font import, Flash IDE will rename your font suffixing it with '_8pt_st' (in case you selected 8px size). So actually instead using your own name inside TextFormat.font property, you should use the original font name.

Assuming that you have a font in your library which you exported with the class name myEmbeddedFont - instead of using font name in format.font property, you point to the exported library class name (format.font = new myEmbeddedFont().fontName;) like this:

var format:TextFormat= new TextFormat();
format.font = new myEmbeddedFont().fontName; // this doesn't work: format.font= "myFont";
var myTextField= new TextField();
myTextField.embedFonts= true;
myTextField.defaultTextFormat = format;

I wrote a more detailed instructions here:
http://www.nivas.hr/blog/2007/06/06/font-embedding-problems-in-flash-cs3-ide/
No screen name said on Jul 18, 2007 at 8:32 AM :
This is the most elegant solution I have found so far. Thank You, I spent all night reading about this little quirk, makes sense though.
JcFx.Eu said on Sep 27, 2007 at 3:30 AM :
The hack above causes problems if you want to embed more than one style of the same font. If you embed "myArial" and "myArialItalic" (the former without any style and the latter obviously with italic selected) and then try:

var format:TextFormat= new TextFormat();
format.font = new myArialItalic().fontName;

You don't get italic text unless you remove myArial from the library.

Is there any solution for this - it's quite a headache for developing text-editing applications?
djtechwriter said on Sep 27, 2007 at 9:48 AM :
You can learn more about embedding fonts here:
http://www.adobe.com/devnet/flash/quickstart/embedding_fonts/
Lukasz Falkowski said on Feb 11, 2008 at 7:36 AM :
@ JcFX:
Actually there is no problem with this.
Keeping your example, if you want to use italic version just use
format.italic = true;

It doesn't matter that myArialItalic().fontName and myArial().fontName return the same value, it's like identifier of whole font family.

It's the same with using css & htmlText instead of TextFormat:
just use something like:
style = "p{ font-family: Arial; font-Style: italic; }";
style += "em{ font-family: Arial; font-Style: normal; }";

I agree that it's confusing for people who are used to AS2 (at least it was for me :) ) but I think that's the way it should be implemented from the beginning.
In AS2 when you ware NOT embedding fonts and using that css it was working fine (the same way as in AS3) but when you used embedded fonts with css there was no difference if you've put "font-Style: italic" or not. It was using italic only if font specified in "font-family:" was embedded as italic that's why you needed two different names for italic and normal version of the same font.

Oh, Dear Adobe, please be more careful writing your documentation! It's misleading people.
No screen name said on Oct 30, 2008 at 5:32 AM :
Hi, sorry for intruding with a question out of the context of this specific section. I want to know if we can develop OCR (Optical Character Recognition) application in Flash CS3. Could someone please give me a hint where to start on this.

 

RSS feed | Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/flash/9.0/main/00000234.html