Laan's steps..

Feed Rss

FXG1.O

07.17.2009, flex, by .

flex4里面有一个模块就是FXG(flex xml graphics),即flex xml图形描述规范。目前是1.0版本。

这里有详细的相关介绍:http://opensource.adobe.com/wiki/display/flexsdk/FXG+1.0+Specification

不过是英文的,这里我稍微翻译一部分(翻译确实很痛苦…)

FXG 1.0 说明文档

FXG(Flex XML Graphics) 1.0 一个基于XML的图形描述规范,专门针对于flash而设计的。FXG支持矢量图形、文字、群组、滤镜、位图等。它的渲染模型和flashplayer10的渲染模型非常相似。FXG以一种更开放的形式展现了Flash平台的强大绘图功能,并且易于扩展。一下列出

FXG vs SVG

SVG其实是更成熟的一个图形XML描述架构。但是,SVG太一般了,完全不能体现出flashplayer的特点,比如filter, transfroms, 文本等等。所以就有了FXG,专门针对flashplayer渲染模型的一个基于XML图形描述架构。当然FXG是站在SVG的肩膀上思考而出现的产物。

FXG基础知识

图形对象(Graphical Objects)
最基本的当然是对矩形、圆形、线条的描述。不过除了这些,还有一些针对flashplayer渲染的支持:比如对图形定位(x,y)的描述,对图形变形(rotation)的描述。

元件(Symbols)

用户flash的人应该都知道元件使用的好处。最简单之一就是可重复使用。FXG容许用户定义多个元件。当然了,一个FXG文件(document)只描述一个元件。这个好理解:一个FXG文件一个元件,也就是一个类(Class)。需要注意的是,这个时候你需要对这个FXG文件制定名称,这样的话,才能对这个元件引用使用。关于元件的使用,很有很多细节地方,最好还是看看官方文档。

效果描述(Raster Effects)

FXG容许你对对象,包括图形对象,图像群组等添加效果,比如filters。

文字(Text and Fonts)
回想一下在flash里面怎么绘制元件时的情况就很清楚了,等于是添加文本并定义文本字体、颜色等等。FXG只不过是用xml的形式来描述而已。

写一个简单的例子:

<?xml version=”1.0″ encoding=”utf-8″?>
<s:Application  xmlns:fx=”http://ns.adobe.com/mxml/2009″  xmlns:mx=”library://ns.adobe.com/flex/halo”  xmlns:s=”library://ns.adobe.com/flex/spark”  >
<mx:Canvas top=”0″ bottom=”0″ left=”0″ right=”0″>
<s:Group x=”100″ y=”20″ width=”200″ height=”200″>
<s:Ellipse width=”50″ height=”50″ x=”80″ y=”80″>
<s:fill>
<s:SolidColor color=”0xff0000″/>
</s:fill>
</s:Ellipse>
<s:RichText width=”100%” height=”80″
columnCount=”2″
columnWidth=”50″
columnGap=”15″>
<s:content>昨天晚上…
你是哪个人啊
我也不知道
难道是鬼?
太好了,终于见到鬼了
</s:content>
</s:RichText>
<s:Rect width=”100%” height=”100%”>
<s:stroke>
<s:SolidColorStroke color=”red”/>
</s:stroke>
</s:Rect>
</s:Group>
</mx:Canvas>
</s:Application>

FXG1.O 有1条回应

  1. 抢沙发喽…laan兄写个svg转FXG的库吧…

    回复

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>