1.) First look on how to setup and use the FontManager
2.) Download UnicodeHexCreator I created to create the unicodeRange.

The AIR Unicode app is used to create the correct unicode range to optimize the amount of bytes that is needed to be loaded. To get the range it’s really simple.

1.) Copy/Paste your entire XML file to the input field (top field)
2.) Select font to use and set class name.
3.) Press convert
4.) Copy/Paste the unicodeRange to the Flex Project that creates the font file.

Download UnicodeHexCreator.

So the idea was to use Flex to compile Font SWF files, a big problem when I use Flash CS4 (fp9) and Flex 3. Flex will not recognize my font SWF file, it will also not recognize my local fonts to embed bold/italic font sets. Using an exported CS3 (fp9) file it works just fine.
Note; fp9 = Flash Player 9.

So lets look of how to do this.
First we need to create our font file.
1.) Create an Flex ActionScript project (I use framework 3.2)
2.) The Class name will be something that we will get later so I renamed my as file to FontHolder.as
3.) Remove the constructor and add the embed tags, example below. Note the unicodeRange tag, these are used to select characters to be embedded, remove to embed the entire font.

package {
	import flash.display.Sprite;
 
	public class FontHolder extends Sprite
	{
		[Embed(systemFont='Verdana', fontFamily='Verdana', mimeType='application/x-font', unicodeRange='U+0061-U+0074')]
		public static const verdana_regular:Class;
 
		[Embed(systemFont='Verdana', fontFamily='Verdana', mimeType='application/x-font', fontWeight='bold', unicodeRange='U+0061-U+0074')]
		public static const verdana_bold:Class;
	}
}

4.) Now you have your font SWF file to use for the project.

So with your font file it’s time to use it in the project. In this example I use my Flex 3 as CS3 development tool., this is because I create Flash Player 9 project. You can of course use only Flash IDE or any other kind of code editor.
1.) Create a new ActionScript project, change the SDK to CS3.
2.) Click next, “Main source folder”, type “src”, this is just to put the files more pretty =), Click Finish.
3.) Create a CSS file that will control the fonts. “default.css”. Just add two classes that we can work with.

h1{
	font-family: Verdana;
	font-size: 24px;
	font-weight: bold;
}
body{
	font-family: Verdana;
	font-size: 12px;
}

5.) Download the FontManager.swc file and add it to your project.

Add SWC HowTo for Flex
6.1.) Create a folder called swc in project folder.
6.2.) Place the FontManager.swc file into the created folder.
6.3.) Right-Click on project folder and select properties
6.4.) In menu choose “ActionScript Build Path”, Choose the tab “Library path”
6.5.) Click on “Add SWC Folder”,  Select the created swc folder and close the windows, all done.

Add SWC HowTo for Flash
7.1.) Create a folder called swc in project folder.
7.2.) Place the FontManager.swc file into the created folder.
7.3.) Open Flash and Publish Settings.
7.4.) Choose the Flash tab and click on Settings next to the script combobox.
7.5.) Choose the “Library Path” tab and add the swc file to the list, all done. 

So, everything is there. How am I using it? Well, this is a dump on the project playground.

To be able to use the fonts they are needed first to be loaded. By default this is the structure for font swf and css file named default. They can be changed by FontManager.name = ‘default’ (the name) and the path with FontManager.path = ‘fonts/’.

The easiest way is to just get the singleton and load it.

var manager:FontManager=FontManager.instance();
manager.addEventListener(Event.COMPLETE, onManagerComplete);
manager.loadStandalone();

When it’s loading just send the textfield, style and text to the FontManager, you can add only textfield and text if you want to add e.g. multiple styles to one textfield.
Here’s some examples.

private function onManagerComplete(event:Event):void
{
	var tf:TextField = new TextField();
	tf.autoSize = TextFieldAutoSize.LEFT;
	tf.border = true;
	tf.rotation = 6;
	FontManager.instance().register(tf, "h1", "abc");
	this.addChild(tf);
 
	var tf1:TextField = new TextField();
	tf1.autoSize = TextFieldAutoSize.LEFT;
	tf1.x = 150;
	tf1.border = true;
	tf1.rotation = 6;
	FontManager.instance().register(tf1, "body", "abc");
	this.addChild(tf1);
 
	var tf2:TextField = new TextField();
	tf2.autoSize = TextFieldAutoSize.LEFT;
	tf2.x = 300;
	tf2.border = true;
	tf2.rotation = 6;
	FontManager.instance().text(tf2, "<h1>abc</h1>\nabc");
	this.addChild(tf2);
}

This doesn’t really works for me because I need specified characters for a lot of different countrys. Usually when developing a flash application I have to handle between 15-50 countrys.

So I made my own little solution, made one of these for flash 6 for a couple of years ago and the trick still works. It basiclly works by loading shared runtime librarys and then embedded fonts will be shared cross the application when using a lot of swf files.

Making it a static class it’s easy to use.

CSS.loadStyleName = "default";CSS.loadStylePath = "css/";CSS.addEventListener(IOErrorEvent.IO_ERROR, this.onError);CSS.addEventListener(Event.COMPLETE, this.onComplete);CSS.initialize( this );

And then to use it on textfields.

txtField.styleSheet = CSS.styleSheet;txtField.embedFonts = true;txtField.htmlText = "<span class='subTest'>Embed Arial</span>";txtField.rotation = 5;
 
txtField2.styleSheet = CSS.styleSheet;txtField2.embedFonts = true;txtField2.htmlText = "<span class='subTest'>Try embed Arial Black</span>";txtField2.rotation = -5;

To make this work.

1.1) Create your shared library file (example: default_lib.fla)

1.2) Create MovieClip on stage and export it for runtime.

1.3) In the MovieClip create a textfield for each font you need, embedd all the characters needed.

2.1) Create your shared library holder file (example: default.fla)

2.2) On the stage add the runtime MovieClip and give it instance name mcFont

3.1) Create your css file (example: default.css)

3.2) Add the styles that your need

4.1) In the Application file add the following load code (look at example in top)

You can download example files here: runtimefonts_as3