Tuesday, October 12, 2010

Simple steps to dynamically load fonts

Finally I have been able to reduce my application size considerably by loading fonts at runtime.
Simple steps to do this:

1)Create a Font css file (give the font file name and font family name that you would use in your flex app)

eg:abc.css

"@namespace s \"library://ns.adobe.com/flex/spark\"
"@namespace mx \"library://ns.adobe.com/flex/mx\" 
"@font-face {
     src: url("AGaramondPro-Regular.otf")
     fontFamily: "AdobeGaramondProRegular" 
     embedAsCFF: true;
            } 


2)Convert it to swf using mxmlc compiler.
mxmlc [options] abc.css
This compiler resides as yourflashbuilderdirectory/sdks/4.0.0/bin/mxmlc.exe

Note:You may get some error related to msvcr71.dll while compiling, so please copy the same from java/jre(your version)/bin directory to the mxmlc directory.

3)load this font swf at runtime

StyleManager.loadStyleDeclarations (path to your font's swf)

Once this swfs get loaded the fonts get embedded and registered automatically.

No comments:

Post a Comment