深入剖析Flex字體旋轉(zhuǎn)方法
你對Flex字體旋轉(zhuǎn)地概念是否了解,這里和大家簡單分享一下,F(xiàn)lex中的字體如果不嵌入的話,是不支持旋轉(zhuǎn)的。官方后來提供的TextLayout包倒是支持,但是那個(gè)引擎比較弱,旋轉(zhuǎn)后字體很丑,不能像嵌入的一樣,邊緣平滑。
Flex字體旋轉(zhuǎn)研究
目的:能夠用最方便的方法實(shí)現(xiàn)中文字體旋轉(zhuǎn)后可見。
明確一點(diǎn):Flex中的字體如果不嵌入的話,是不支持旋轉(zhuǎn)的。官方后來提供的TextLayout包倒是支持,但是那個(gè)引擎比較弱,旋轉(zhuǎn)后字體很丑,不能像嵌入的一樣,邊緣平滑。
1、先來看下默認(rèn)狀態(tài)下的Flex字體:
code:
- <?xmlversionxmlversion="1.0"encoding="utf-8"?>
- <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
- layout="absolute"backgroundGradientAlphas="[1.0,1.0]"
- backgroundGradientColors="[#FFFFFF,#FFFFFF]">
- <mx:Script>
- <![CDATA[
- privatefunctiongetInfo():void{
- lblInfo.text="字體:"+txaTest.getStyle("fontFamily");
- }
- ]]>
- </mx:Script>
- <mx:TextAreaidmx:TextAreaid="txaTest"x="210"y="132"/>
- <mx:Buttonxmx:Buttonx="401"y="131"label="trace"click="getInfo()"/>
- <mx:Labelidmx:Labelid="lblInfo"x="401"y="161"/>
- </mx:Application>
如代碼所示,TextArea默認(rèn)的字體是[Verdana],Verdana是英文字體,不知此時(shí)顯示的中文是由什么支持的。#p#
2.指定字體為[Verdana]
改一行代碼:
- <mx:TextAreaidmx:TextAreaid="txaTest"x="210"y="132"
- fontFamily="Verdana"/>
結(jié)果:
中文依然可以顯示,換成Arial也可以
3、先做個(gè)旋轉(zhuǎn)看看
旋轉(zhuǎn)前:
旋轉(zhuǎn)后:
意料之中,一片空白,不過再轉(zhuǎn)回去后又可以顯示出來,這點(diǎn)能利用起來也不錯(cuò)。
code:
- <?xmlversionxmlversion="1.0"encoding="utf-8"?>
- <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
- layout="absolute"backgroundGradientAlphas="[1.0,1.0]"
- backgroundGradientColors="[#FFFFFF,#FFFFFF]">
- <mx:Script>
- <![CDATA[
- privatefunctiondoRotation():void{
- txaTest.rotation+=15;
- getInfo();
- }
- privatefunctiongetInfo():void{
- lblInfo.text="字體:"+txaTest.getStyle("fontFamily");
- }
- ]]>
- </mx:Script>
- <mx:TextAreaidmx:TextAreaid="txaTest"x="210"y="132"fontFamily="Arial"/>
- <mx:Buttonxmx:Buttonx="401"y="131"label="trace"click="doRotation()"/>
- <mx:Labelidmx:Labelid="lblInfo"x="401"y="161"/>
- </mx:Application>
#p#4、現(xiàn)在試試嵌入的[Verdana]字體
旋轉(zhuǎn)后可以顯示了,不過這個(gè)時(shí)候就不支持中文了,中文無法輸入,嵌入字體會將整個(gè)字體文件嵌入到swf中,這無疑會增加swf的體積,英文字體還好,一般也就幾百K,中文字體就龐大得多了,一般在10MB左右,顯然嵌入中文字體很不現(xiàn)實(shí)。
嵌入前swf大?。?94310bytes
嵌入后swf大小:351562bytes
code:
- <?xmlversionxmlversion="1.0"encoding="utf-8"?>
- <mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"
- layout="absolute"backgroundGradientAlphas="[1.0,1.0]"
- backgroundGradientColors="[#FFFFFF,#FFFFFF]">
- <mx:Style>
- @font-face{
- src:local("Verdana");
- font-family:myFont;
- }
- </mx:Style>
- <mx:Script>
- <![CDATA[
- privatefunctiondoRotation():void{
- txaTest.rotation+=15;
- getInfo();
- }
- privatefunctiongetInfo():void{
- lblInfo.text="字體:"+txaTest.getStyle("fontFamily");
- }
- ]]>
- </mx:Script>
- <mx:TextAreaidmx:TextAreaid="txaTest"x="210"y="132"fontFamily="myFont"/>
- <mx:Buttonxmx:Buttonx="401"y="131"label="trace"click="doRotation()"/>
- <mx:Labelidmx:Labelid="lblInfo"x="401"y="161"/>
- </mx:Application>
【編輯推薦】
- 實(shí)例解析Flex字體的使用
- FlexBuilder4十大新特性閃亮登場
- 學(xué)習(xí)總結(jié) 在Flex中如何嵌入Flex字體
- 揭開Flex正則表達(dá)式的神秘面紗
- FlexBuilder開發(fā)方法及特點(diǎn)解析