在學習Flex的過程中，你可能會遇到Flex字體使用問題，這里和大家分享一下，相信通過本文的介紹你對Flex字體的使用會有深刻的認識。今天在把玩開源的Flex系統和控件時碰到了字體不能編譯的問題，所以對字體進行了較為深入的研究。

Flex支持的TrueType和OpenType類型的字體

這里介紹一下他們之間的區別

◆TrueType字體可調整到任意大小，并且在所有大小情況下，都是清晰可讀的。可以將它們發送給Windows支持的任何打印機或其他輸出設備。

◆OpenType字體與TrueType字體相關，但包括更大的基本字符集擴展，包括小型大寫、老樣式數字及更復雜的形狀，如“字形”和“連字”。

Flex字體的使用

以下個例子是使用本地的字體，這些字體讀取的默認路徑是C:\WINDOWS\Fonts，在你把玩別人的Flex應用時，你需要注意他人的字體你是否都有了。

viewplaincopytoclipboardprint?  
<mx:Style> 
@font-face  
{  
src:local("Tahoma");  
fontFamily:localFont;  
fontWeight:bold;  
}  
</mx:Style> 
<mx:ButtonfontFamilymx:ButtonfontFamily="localFont"label="TryMe"/> 
<mx:Style> 
@font-face  
{  
src:local("Tahoma");  
fontFamily:localFont;  
fontWeight:bold;  
}  
</mx:Style> 
<mx:ButtonfontFamilymx:ButtonfontFamily="localFont"label="TryMe"/> 
 

 你也可以通過url定義Flex字體，然后就可以使用相對或絕對路徑定義字體 

viewplaincopytoclipboardprint?  
<mx:Style> 
@font-face  
{  
src:url("assets/tahoma.ttf");  
fontFamily:localFont;  
fontWeight:bold;  
}  
</mx:Style> 
<mx:ButtonfontFamilymx:ButtonfontFamily="localFont"label="TryMe"/> 
<mx:Style> 
@font-face  
{  
src:url("assets/tahoma.ttf");  
fontFamily:localFont;  
fontWeight:bold;  
}  
</mx:Style> 
<mx:ButtonfontFamilymx:ButtonfontFamily="localFont"label="TryMe"/> 
 

 @font-face所有屬性如下

src:url("assets/aaa.png")字體url  
 
src:local("Tahoma");本地字體  
fontFamily:localFont;字體別名  
 
fontStyle:italic;字體傾斜  
fontWeight:bold;字體的粗細默認為normal  
 
advancedAntiAliasing:true字體防鋸齒  
 

 ◆最后講下在css中使用Flex字體

viewplaincopytoclipboardprint?  
<mx:Style> 
@font-face  
{  
src:url("assets/Abduction.ttf");  
fontWeight:normal;  
fontFamily:localFont;  
}  
.coolStyle  
{  
fontFamily:localFont;  
fontWeight:normal;  
}  
</mx:Style> 
<mx:ButtonstyleNamemx:ButtonstyleName="coolStyle"label="TryMe"/> 
<mx:Style> 
@font-face  
{  
src:url("assets/Abduction.ttf");  
fontWeight:normal;  
fontFamily:localFont;  
}  
.coolStyle  
{  
fontFamily:localFont;  
fontWeight:normal;  
}  
</mx:Style> 
<mx:ButtonstyleNamemx:ButtonstyleName="coolStyle"label="TryMe"/> 
 

【編輯推薦】

1. 技術分享 在Flex中嵌入Flex字體的步驟
2. FlexBuilder4十大新特性閃亮登場
3. 學習總結 在Flex中如何嵌入Flex字體
4. 揭開Flex正則表達式的神秘面紗
5. FlexBuilder開發方法及特點解析