在學(xué)習(xí)Flex的過(guò)程中，你可能會(huì)遇到Flex字體使用問(wèn)題，這里和大家分享一下，相信通過(guò)本文的介紹你對(duì)Flex字體的使用會(huì)有深刻的認(rèn)識(shí)。今天在把玩開(kāi)源的Flex系統(tǒng)和控件時(shí)碰到了字體不能編譯的問(wèn)題，所以對(duì)字體進(jìn)行了較為深入的研究。

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

這里介紹一下他們之間的區(qū)別

◆TrueType字體可調(diào)整到任意大小，并且在所有大小情況下，都是清晰可讀的?？梢詫⑺鼈儼l(fā)送給Windows支持的任何打印機(jī)或其他輸出設(shè)備。

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

Flex字體的使用

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

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"/> 
 

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

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;字體的粗細(xì)默認(rèn)為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. 技術(shù)分享 在Flex中嵌入Flex字體的步驟
2. FlexBuilder4十大新特性閃亮登場(chǎng)
3. 學(xué)習(xí)總結(jié) 在Flex中如何嵌入Flex字體
4. 揭開(kāi)Flex正則表達(dá)式的神秘面紗
5. FlexBuilder開(kāi)發(fā)方法及特點(diǎn)解析