Flash AS3 Loading Fonts

dan — Tue, 13 May 2008 17:23:29 +0000

Create a Flash AS3 application that loads an external font at runtime… Sounds easy enough… But it is a little tricky. I needed to create a flash app that allowed users to choose a font from a list and load that into a player. I wanted to offer several fonts but did not want to bloat the load-time with unused fonts. I could not find much help on this topic… Luckily I found betriebsraum and with that I was able to hack up something that worked for me.

Step 1: Created an external swf with the font I needed. (I created separate ones for each font I was going to offer.)

Created a new Fla and add a font to the library.
In the Library pane(F11), click the options dropdown, and choose ‘New Font’
Select a font, size and style–size is not important (arguably)–however, I believe you will have to create separate fonts for each style you require. The name is not important really either.
Right click the new font in the Library and select ‘Linkage…’
- Check ‘Export for ActionScript’ and ‘Export in first frame’.
- Give it a Class:–this name is important and you will need to remember it. I used ‘EFont01′ fig. 1

Publish the swf as ‘/font-Fontname.swf’.

Step 2: Create the Application:

Create a new Flash CS3/As3 application set the Document class as ‘Main’ and save it as ‘/myapp.fla’
Create a new AS3 script and save it as ‘/Main.as’

Main.as

package {
 	import flash.display.Sprite;
 	import flash.text.*;
 	import flash.events.*;
 	public class Main extends Sprite {
 	 	var t:TextField = new TextField();
 	 	var f = new TextFormat();
 	 	public function Main() {
 	 	 	var font = new LoadFont("font-Zapfino.swf",["EFont01"]);
 	 	 	font.addEventListener(LoadFont.COMPLETE, successLoadFont);
 	 	 	font.addEventListener(LoadFont.ERROR, failLoadFont);
 	  	}
 	 	private function failLoadFont(e:Event){
 	 	 	f.font="Arial"; //default font if load fails.
 	 	 	t.embedFonts = false;
 	 	 	post();
 	 	}
 	 	private function successLoadFont(e:Event){
 	 	 	var embeddedFonts:Array = Font.enumerateFonts(false);
 	 	 	f.font=embeddedFonts[0].fontName;
 	 	 	t.embedFonts = true;
 	 	 	post();
 	 	}
 	 	public function post(){
 	 	 	f.size = 36;
 	 	 	t.defaultTextFormat = f;
 	 	 	t.x = 100;
 	 	 	t.y = 100;
 	 	 	t.background = true;
 	 	 	t.autoSize = TextFieldAutoSize.LEFT;
 	 	 	t.text = "We are in loaded Font";
 	 	 	addChild(t);
 	 	}
 	}
}

Create a new AS3 script and save it as ‘/LoadFont.as’

LoadFont.as

package {
 	import flash.display.*;
 	import flash.events.*;
 	import flash.text.*;
 	import flash.errors.*;
 	import flash.system.*;
 	import flash.net.*;
 	public class LoadFont extends EventDispatcher {
 	 	public static const COMPLETE:String = "complete";
 	 	public static const ERROR:String = "error loading font";
 	 	private var loader:Loader = new Loader();
 	 	private var _fontsDomain:ApplicationDomain;
 	 	private var _fontName:Array;
 	 	public function LoadFont(url:String,fontName:Array):void {
 	 	 	_fontName = fontName;
 	 	 	trace("loading");
 	 	 	loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, font_ioErrorHandler);
 	 	 	loader.contentLoaderInfo.addEventListener(Event.COMPLETE,finished);
 	 	 	loadAsset(url);
 	 	}
 	 	private function loadAsset(url:String):void {
 	 	 	var request:URLRequest = new URLRequest(url);
 	 	 	loader.load(request);
 	 	 }
 	 	function finished(evt:Event):void {
 	 	 	_fontsDomain = loader.contentLoaderInfo.applicationDomain;
 	 	 	registerFonts(_fontName);
 	 	 	dispatchEvent(new Event(LoadFont.COMPLETE));
 	 	}
 	 	function font_ioErrorHandler(evt:Event):void {
 	 	 	dispatchEvent(new Event(LoadFont.ERROR));
 	 	 }
 	 	public function registerFonts(fontList:Array):void {
 	 	 	for (var i:uint = 0; i < fontList.length; i++) {
 	 	 	 	Font.registerFont(getFontClass(fontList[i]));
 	 	 	}
 	 	}
 	 	public function getFontClass(id:String):Class {
 	 	 	return _fontsDomain.getDefinition(id)  as  Class;
 	 	 }
 	 	public function getFont(id:String):Font {
 	 	 	var fontClass:Class = getFontClass(id);
 	 	 	return new fontClass    as  Font;
 	 	}
 	}
}

Moki Systems Blog » Flash

Flash AS3 Loading Fonts