Sep 12 2009

Family font embed in AS3 in the right way

Category: ClassesHadi Tavakoli @ 10:44 pm

Well, if you're reading this post, you've probably have already searched a dozen web pages to find one final good solution for embeding fonts in flash in the most appropriate way.

be happy, you have just found it finally :) here I try to talk about what I have understood from fonts and how to embed them into your flash. (Personally, I don't code in flex but this method will also work in flex of course)

what you gotta know, well of course you know, is that every font usually has four faces, regular, bold, italic and bold italic. some fonts don't but let's talk about Verdana which has all the faces.

I'm not a fan of importing anything into my FLA libraries and I try to code as abstract and dynamic as possible so I'm going to embed fonts with the flex approach of:

[Embed(source="verdana.ttf", fontFamily...

ok, what I'm doing is that I will be using a lot of fonts in an application that I'm building and I don't want to load up all the fonts into the main file and instead I want to load fonts only when they are needed or asked for.

so, I open a new FLA file and on the first frame, type the below code:


		  
		  
		  
		  
		  
		  
		

Now, let's see what is happening exactly.  Firstly we have source="verdana.ttf" .This is the path to your font file and in this case, I have put the font file where I have my FLA. note that only .ttf files can be used (or you tell me if I'm wrong?!).

then we have fontFamily="Verdana" and this will be the font name you'll be using in your project to call the font.

if you're embeding a regular font, that's all and you're done but if you're embeding another fon't file like verdanab.ttf which includes bold verdana, you have to use the folwloing fontWeight="bold" also when embeding italic version, you should use the follwoing fontStyle="italic" and even use both of them if you're embeding bold and italic version together :) anyway, the above code will work fine.

that's it,  just save the file and test your movie... if you're doing that in a flash IDE, most probably you will see an error plus a warning page saying something about some flex library path lab, lab, lab... just feel relax and hit the button "update library" and hit "Ctrl+Enter" again and this time you won't see any error message... that's it you're done.

now you can simply load your swf file into your project and use the "fontFamily" attribute to show the font :)

Enjoy,

Hadi

Tags: , , , , , , , , ,