关于flash使用嵌入字体的说明

Flash字体嵌入方法总结—(1)基础篇

大家都知道在Flash中嵌入中文 字型有个最大的问题就是文件 量的限制，所以也都知道在Flash中有选择的嵌入字型是一个有效的方法。但是对在 ActionScript中嵌入字体的技巧就不一定完全了解了。最近因为项目的关系，让我好好把这方面问题做了一次梳理。作为温故知新，我们先来简单看看最简单常见的方法。

上图是Flash CS4的文字相关界面。为一个动态文本框嵌入文件的基本方法是，在Character Embedding的弹出面板填入你所需要的字符。在上方的列表中是一些常用的字符范围。比如做Loading显示的，只要嵌入第四项Numerals， 或许再多加一个“%”的符号就可以了。

在动态文本框中嵌入的这些字符在该swf 文件中都是有效的。也就是说在一个swf文件中同一种字体的字符只需要嵌入一次，所有的动态文本框都能使用。所以通常的做法是把所有需要的字符都填充到一个文本框，作为全局的字体资源库，这样找起来最方便。

此外的第二种方法就是字体元件了。在库面板点右键建立Font Symbol：

这种方法可以方便的嵌入整个字型，但是因为不能选择需要嵌入的字体，所以对于中文来说几乎形同鸡肋。

此外如果要使用字型的变体：斜体和黑体，都需要另外嵌入的。因为这些变体其实算是另一种字体。面板中"Faux"的意思是指用矢量引擎虚拟出来的字型，其实原字体并没有这些变体可供选择。如果字体包含了各种变体，那么这两个选项是不可用的。


对某些不规范的或者是笔划复杂的中文字体，矢量引擎处理比较容易出错。如文字中空心的部分会变成有填充的，有的甚至会造成播放器 崩溃。所以大家在使用"Faux"的时候要特别留意。

此外提醒一下大家：CS4的文字面板中已经没有粗体和斜体的按钮 了，别以为没这功能了，在Text菜单里面还是可以找到的。

如果要把字体当作位图来处理，就要选择Bitmap Text位图字体。Size参数是指位图字体的大小，对矢量字体来说没意义。这个选项主要用于嵌入类似04系列这样的像素字体。

在例子中，我们建立了一个名为"MyAria l"的字体，映射系统中的Arial Regular。记得激活"Export for ActionScript"，这样字体资源才会被编译。

建好了字体元件后我们在字体菜单里能够看到自定义的字体以*号做了标识。现在对于文本框来说，字体无论是选择"Arial"或者"MyArial" 都是可以的。用ActionScript设置文本框的embedFonts属性为true，使得文本框使用嵌入字体渲染就可以了。如果不想用到 ActionScript，但是在字体设置面板中没有直接设置使用嵌入字体的开关，怎么办。我的方法是随便在嵌入框中打一个字符，如空格，使得嵌入的字符 数不为0。这样也就间接激活了动态文本框的embedFonts。由于我们已经使用字体元件嵌入了整个字体，所以系统能够找到字体对应的矢量信息 (glyph)。


Flash字体嵌入方法总结—(2)ActionScript基础篇
接着我的上一个转过来的帖子说
在上一篇使用字体元件的时候，我们接触到了TextField对象的embedFonts属性。在这里，我们进一步的探讨一下怎么在ActionScript中使用嵌入文本。

一旦我们在Flash IDE中嵌入了字体，swf文件中就包含了该字体的矢量信息。ActionScript也可以使用这些信息。继续上文的例子，我们添加如下代码 ：
var fmt:TextFormat = new TextFormat();
fmt.font = "STZhongsong";//华文中宋
fmt.size = 36;
fmt.color = 0x336699;

var txt:TextField = new TextField();
txt.text = "中文字型测试";
txt.autoSize = TextFieldAutoSize.LEFT;
txt.embedFonts = true;
txt.setTextFormat(fmt);
addChild(txt);


我们用ActionScript建立了一个文本框，内容为“中文字型测试”，字体为“华文中宋”。因为“测试”这两个字体信息没有被嵌入，所以不会被渲染出来。再来看看使用css的两种用法：

var style:StyleSheet = new StyleSheet();
style.parseCSS("foo{font-family:STZhongsong;font-size:36;color:#336699}");

// 用法1
var fmt:TextFormat = style.transform(style.getStyle("foo"));
txt.text = "中文字型测试";
txt.setTextFormat(fmt);

// 用法2
//txt.styleSheet = style;
//txt.html Text = "<foo>中文字型测试</foo>";

两种方式都可以把格式赋给文本框，但是和TextFormat方法一样的是需要注意字体的名字不是我们在IDE里看到的“华文中宋”，而是字体的英文名"STZhongsong"。如何找到字体的英文名可以到字体目录里去查看信息，也可以用我在下一篇进阶篇中介绍的方法。

以上总结的是ActionScript使用嵌入字体的方法，但都是基于在IDE中完成了字体嵌入的操作的。下面我们来看看另外的方法：使用Flex SDK。

首先大家都应该看看gotoAndLearn上的这篇视频 教程 ，Lee非常详尽的介绍了使用Runtime Font Loading的方法。通过使用Flex SDK，使得在ActionScript中嵌入字体变为可能。我们来看看嵌入字体所使用的代码：

[Embed(systemFont="Arial", fontName="MyArial", unicodeRange="U+0020-U+007e", mimeType="application/x-font")]
var ClassName : Class;

在这两行代码中，我们创建了一个虚拟字体"MyArial"。和在IDE中的操作效果 一样，映射的是系统字体Arial的标准形式。unicodeRange 是我们所需要的重要参数，它界定了嵌入字符的范围。"U+0020"这类的数字表示字符的unicode编码，虽然没有在IDE里面直观，但是我们可以用教程里提到的在线工具作为辅助。

经过一番搜索，发现了polyGeek上开发 了一个for Flex css的字体嵌入工具。根据他的算法 ，我改写了一个输出Embed标签的，并加入了一些汉字用的范围，完善了更多功能，命名为：Flash中文字体嵌入助手。
http://kevinca*.com/app/font/

如果你使用Flex SDK编译的话，可以用这个工具生成的类代码，建立一个自己的FontLibrary。在要使用这个字体的地方，只要在文档类中包含一个对 FontLibrary的引用，就可以把字体一起编译进来。更多使用FontLibrary的方法和思路，我们在下一篇深入讨论。

此外还需要提一下字体的变体样式。Flex SDK同样支持嵌入斜体或粗体，但是如果是使用外部字体嵌入，使用变体会在编译时报错，同样的设置用系统字体则没有问题。提醒大家使用的时候注意一下。

Flash字体嵌入方法总结—(3)ActionScript提高篇
现在我们了解了Flash字符嵌入的几种方法，也知道了怎么在IDE和ActionScript中使用嵌入字体。但是在开发项目中，通常会有很多 swf文件（页面或模块），它们大都使用相同的字体。我们不得不在每个文件中重复嵌入字体。有没有办法打破单个swf的使用范围的限制呢？

方法一是使用运行时共享（runtime share）技术。首先用前文讲述的方法建立一个"MyArial" 字体，选择Export for ActionScript。然后选择Export for runtime sharing（为运行时共享导出），填入完整文件路径。最后发布fontLibrary.swf文件。这样我们就得到了一个运行时字体库，下面我们再来 看看如何在其他swf中使用。

新建一个fla文档，在File菜单下选择Open External Library（打开外部库）。在新打开的库面板中可以看到我们刚才建立的"MyArial"，把它拖动到当前文件的库面板中。Flash自动为我们导入了这个字体，右键点开属性如下图所示：


Import for runtime sharing表示这个元件是外部导入的。现在和正常使用字体元件一样，创建一个动态文本框，选择"MyArial"字体，随便打入一些文字，发布文件。 从生成的文件量上来分析可以得出字体矢量信息并没有被编译进来，而是动态地从fontLibrary.swf获取的。Flash Player自动为我们完成了这一过程。

方法二是利用ActionScript里的Font类来向系统动态的注册字体。首先用Flash中文嵌入助手生成类代码，贴进Flex编辑器，将其作为文档类编译生成fontLibrary.swf文件。

注意构造函数下的这句代码：

Font.registerFont(ClassName);

通过执行registerFont()方法，一旦fontLibrary.swf被加载 （即实例化），我们就在系统中注册了名为"FontName"的字体。当然我们也可以在需要的时候再去向系统注册而不在构造函数中执行。

字体注册后，就等同于在客户端安装了这种字体，我们可以随意的使用。

相比第一种方法只能嵌入整个字体的限制（参见前文对于字体元件的解释），这种方法不仅解决了问题，而且更加灵活。也是目前使用汉字文字共享库的唯一办法，下面让我们来看一下实例。

建立FontLibrary.fla文件，在第一帧输入以下代码：

[Embed(systemFont=&quot;华文中宋&quot;, fontName=&quot;MyFont&quot;, unicodeRange=&quot;U+4e2d,U+6587,U+5b57,U+578b&quot;, mimeType=&quot;application/x-font&quot;)]
var MyClass : Class;

Font.registerFont(MyClass);

我们建立了一个"MyFont"字体，包含了“华文中宋”字体的四个中文字符矢量信息：“中文字型”，并向系统注册。执行编译生成了fontLibrary.swf文件。

然后另外建立要使用字体库的文件，在第一帧写下以下代码：

var loaderoader = new Loader ();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, completeHandler);
loader.load(new URLRequest(&quot;fontLibrary.swf&quot;));

function completeHandler(event : Event):void {
        loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, completeHandler);
        var fmt:TextFormat=new TextFormat(&quot;MyFont&quot;,68,0x336699); //使用MyFont字体
        var txt : TextField = new TextField();
        txt.autoSize=TextFieldAutoSize.LEFT;
        txt.embedFonts=true;
        txt.text=&quot;中文字型&quot;;
        txt.setTextFormat(fmt);
        addChild(txt);
}

以上代码先用loader加载fontLibrary.swf。当加载完毕以后，新建的文本框就可以使用我们的自定义字体"Myfont"了。

Flash字体嵌入方法总结—(4)进阶篇
前面已经把基本上嵌入字体的相关知识都梳理了一遍：

    * 如何在Flash IDE中嵌入字体
    * 如何在Flash IDE中使用嵌入的字体
    * 如何使用Flex SDK嵌入字体
    * ActionScript如何使用嵌入的字体
    * 运行时共享字体库的两种方法

下面讨论一下几种问题和可能性：

    * Font类只有registerFont()方法，而没有unregisterFont()。不知道如果向系统中多添加一些字体定义以后会不会有内存占用的问题。
    * 把整个中文字库完全嵌入所增加的文件量大约在5M-10M，现在的视频Intro也差不多要3M-5M。随着宽带的进一步发展，把中文字库完全嵌入也并非不可能。
    * 在文字内容可知的情况下，不管用哪种方法，我们都必须手动去生成字体库。当然如果是配合CMS后台的话，可以编写后台程序 来批处理的生成AS文件。配合命令行调用编译器甚至可以直接生成包含字体的swf文件。关于这方面的讨论，可以看看这里或这里。
    * 进一步想，用户输入的字符用嵌入字体来渲染也并非不可能。关键是精简初始字库，然后逐步加载更完整的字库。比如我们可以先加载常用汉字"Font1"（1M-2M左右），然后再加载其余的汉字"Font2"。
      那么如何调用正确的字体来实时显示呢？我们可以借助Font类实例的一个hasGlyphs()方法，来检测当前字体是否包含了某个字符的矢量信息(glyphs)。如果字符已经可以被渲染，则设置embedFonts，否则我们则用系统字体来显示。