flex中不加载字库，让文字转向(rotation)

 flex中不加载字库，让文字转向(rotation)

作者：EoS_3tion

群里有人说道将字体旋转，大家马上就想到，flex3的帮助文档中说过，通过内嵌字体，可以做到文字抗锯齿，旋转等效果，这里我就不多说了，有兴趣了解的，看官方文档：
http://livedocs.adobe.com/flex/3/html/help.html?content=fonts_04.html#133851
显然这样的方法对于欧美这些文字来说是非常有效的方法。
一个嵌入字体，最多不会超过50K。
可是对于我们博大精深的中文来说，随便一个字体就是10M左右，如果嵌入到flash中，显然不是合适的做法。
当然，也有朋友用外嵌字体，将字体打包成另外一个swf文件，然后由主flash文件去外部调用。参考这篇文章：http://bbs.blueidea.com/thread-2792010-1-1.html
当然这也是个不错的解决方法，但是依旧是要加载一个10M左右的字体文件，虽然可以在后台进行，而先让用户处理其他的事情。

仅仅是一个文字的旋转，难道没有方便的解决方法吗？
突然我脑袋里想到了bitmapData这个对象。曾经我在做我的paint.3tion.com我的第一个flex程序的时候看到过的一个被我弃用的对象。
我是否能首先将文字赋值给一个组件，比如赋值给一个label，然后获取这个label的bitmapData，再将这个作为图形的形式来旋转，缩放，虽然图片会失真，但是却可以做到不用嵌入字体，而直接调用用户的系统字体。可以大幅减少swf文件的大小。

于是我写了如下代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

    <mx:Style>

         .myStyle1

         {

             font-family:宋体;

             font-size:14px;

         }

    </mx:Style>

    <mx:Script>

         <![CDATA[

             import mx.controls.Image;

             private function init():void

             {

                  var bmp:BitmapData = new BitmapData(aa.width,aa.height,true);

                  bmp.draw(aa);

                  var bt:Bitmap = new Bitmap(bmp);

                  var img:Image = new Image();

                  img.source = bt;

                  img.x = 200;

                  img.y = 200;

                  img.rotation = 120;

                  addChild(img);

             }

         ]]>

    </mx:Script>

    <mx:Label id="aa" x="143" styleName="myStyle1" y="139" text="3tion是天才" creationComplete="init()"/>

</mx:Application>

 

我按下F11键。bingo!
和我的想象的情况基本一致。出现了这样的画面：

其中水平显示的就是label控件的值。
而那个白色的就是旋转后的结果。
由于没有对BitmapData做透明的处理，显示出了白色的背景。不过这个思路，很明显是行得通了。bitmapData也可以做相应的抗锯齿处理，我想处理之后效果应该比这要清晰一些。