Flex 中文字体终极解决方案

一直以来Flash对中文的支持就不是很好,很多人都发现很多汉字在Flex中无法设置粗体,就是其中一个表现,经过一晚上的折腾,终于突破了这个难题,其实,答案就在Adobe的官方教程里,只能怪自己英文水平太差,废话不表,直入正题,为了便于描述,以google的思源黑体为例:

第一步:将字体编译成swf文件

将自己需要的字体(常规和粗体一般是分开的两个字体文件,如果你还需要斜体和粗斜体,也可拷贝进来)拷贝到自己的程序中,我这里是将思源黑体的NotoSansHans-Regular.otf和NotoSansHans-Bold.otf拷贝到src根目录(这些在编译后就可以删掉了),然后在根目录建立syht.css,内容如下:

/* CSS file */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";

@font-face
{
	src:url('NotoSansHans-Regular.otf');
	font-family:syht;
	font-weight:normal;
	embed-as-cff:true;
}

@font-face
{
	src:url('NotoSansHans-Bold.otf');
	font-family:syht;
	font-weight:bold;
	embed-as-cff:true;
}

然后右键:Compile CSS to SWF,编译后会在目标文件夹生成syht.swf文件,这个就是包含了思源黑体的字体文件了,然后可以删除掉字体文件和syht.css,避免项目在重编译时耗费时间.

第二步:加载字体文件

在主程序的初始化阶段加载字体文件,这里我是将syht.swf放在程序根目录.

protected function application1_initializeHandler(event:FlexEvent):void
{
      FlexGlobals.topLevelApplication.styleManager.loadStyleDeclarations2("syht.swf", true);
}

上述代码中主程序在载入完成后会立即加载syht.swf字体文件

第三步:添加对EmbeddedFontRegistry的引用

在主程序中import mx.core.EmbeddedFontRegistry;

<fx:Script>
    <![CDATA[
        import mx.core.FlexGlobals;
        import mx.events.FlexEvent;
        import mx.core.EmbeddedFontRegistry;
        EmbeddedFontRegistry;

        protected function application1_initializeHandler(event:FlexEvent):void
        {
            FlexGlobals.topLevelApplication.styleManager.loadStyleDeclarations2("syht.swf", true);
        }

    ]]>
</fx:Script>

第四步:添加编译选项-theme+=frameworks\projects\spark\MXFTEText.css

如果提示找不到该文件,请直接去SDK包里对应的目录下找,并拷贝到程序中,比如拷贝到根目录,那么-theme+=MXFTEText.css即可

然后就可以设置fontFamily=syht来应用字体了,一般都是在global样式中设定默认字体,我就不写代码了.

另外,如果是Flex3,那么请忽略第四步,并且第一步的css中embed-as-cff请设置为false