Styling Text In Instances Of Components Using TextFormat

This blog has moved.

this is an extension of a previous entry here.

Text in components or TextFields can be formatted in several ways - applying styles manually in the case of TextFields, applying a style using a TextFormat object, StyleSheets for styling html formatted text, or the StyleManager for setting global styles or styles for all instances of a component.


This article focuses on styling instances of components or TextFields with an embedded font in a TextFormat object.


The TextFormat Object would look something like this:

//let's use red Comic Sans to make it obvious when it's working.
//first embed Comic Sans in the library
//select Linkage Properties on the font, select 'Export for ActionScript' and give it the Class name of 'ComicSans'.
var format:TextFormat=new TextFormat();
format.font=new ComicSans().fontName;
format.color=0xFF0000;

Use the following code to apply this TextFormat style to the following display object types(all of which i've assumed have the instance name 'whichObject'.)


TextField

whichObject.embedFonts=true;
whichObject.defaultTextFormat=format;

Button, TextArea, TextInput, Label, NumericStepper, RadioButton, CheckBox

whichObject.setStyle("embedFonts", true);
whichObject.setStyle("textFormat", format);

ComboBox

whichObject.textField.setStyle("embedFonts", true); //textField is the item displayed in the combo box
whichObject.textField.setStyle("textFormat", format);
whichObject.dropdown.setRendererStyle("embedFonts", true); //dropdown is the list of options
whichObject.dropdown.setRendererStyle("textFormat", format);

List

whichObject.setRendererStyle("embedFonts", true);
whichObject.setRendererStyle("textFormat", format);

DataGrid

whichObject.setRendererStyle("embedFonts", true);
whichObject.setRendererStyle("textFormat", format);
whichObject.setStyle("headerTextFormat", format); //styles the datagrid's header
STOP PRESS:

Update to this post here: