【转】深入Flex4——了解Element和Child的异同


当我了解到Flex4那些对我诸多裨益的新特性后,我便决定转而使用它。刚开始的时候,我试图利用在Flex前作中的认识和既有经验来快速进入状态。但很快我便发现有时即使面对一些显而易见的问题我也不得不求助于API文档或者运行一些示例程序来弄清这种问题的来龙去脉。根据以往经验,Flex3的Halo在处理显示列表的时候隐藏了大量的实现细节和不良设计。然而一旦你开始使用新的Spark架构后,你就得以近距离的面对这些实现细节—Halo究竟在私底下干了什么,而且你会体会到为什么说Spark对于显示列表的处理更为“直白”。

“elements”是一个关键性的问题。elements是何物?它同child是否是一回事?刚开始的时候我曾武断的认为elements不过是children的另一种说法。通过反复梳理组件中所有的elements和children,我发觉在新的容器类(也包括一些经过改良的传统容器)某些似乎是理所当然应该具备的方法消失了。如果没有getElements(),我该如何获取elements的数目呢?我能否把getChildren()的返回结果作为IVisualElement来对待。这令我十分纠结。

困扰的我于是开始认真阅读学习API文档,Flex的源码以及相关的博客文章。我也曾尝试解读一些博主发布的关于Flex4新特性的幻灯片。然而事实证明脱离讲解而孤立的看幻灯片作用相当有限。

最后,我拼凑了一些言简意赅的示例。这些示例将带领我了解有关elements的全新知识,告诉我那些在新的Spark容器背后发生的故事。 继续阅读【转】深入Flex4——了解Element和Child的异同

包含Alert、MenuBar等更多组件的Flash组件,可用于纯AS项目

2014-03-20更新:加入Yahoo! Astra 组件源文件下载


Flex或纯AcitonScript项目中使用Flash组件一文中,我介绍了在纯AS项目中使用FlashUI组件的方法,并提供了FlashUI.swc的下载。由于Flash提供的UI中缺少一些常用的组件(如Alert、Menu等),我将Yahoo! ASTRA Flash Components整合进入了FlashUI.swc中,以方便使用。整合进入的组件包括:

UI类:

AutoComplete、AlertManager、AudioPlayback、Carousel 、Form、Menu、MenuBar、TabBar、Tree

布局类:

HBoxPane、VBoxPane、FlowPane、TilePane、BorderPane

图表类:

BarChart、 ColumnChart、LineChart、PieChart

ASTRA组件的使用文档:http://developer.yahoo.com/flash/astra-flash/classreference/

同时整合进入FlashUI.swc的,还有Flash自带的Video类组件。使用文档

所有整合的组件列表:

所有整合的组件列表

整合后的swc文件命名为FlashUIPlus.swc。如果只希望使用基本的组件,也仍然可以使用原来的FlashUI.swc

  FlashUIPlus.swc (342.8 KiB, 2,149 hits)
若下载到的是zip文件,请将后缀改为swc即可。

2014-03-20 更新:今天发现Yahoo的Flash开发者网站已经不能访问了,为了方便大家,我把收藏的Yahoo! Astra组件的源文件、文档等等全部共享了,请在下面下载:

  Yahoo! Astra 组件源文件(金山快盘) (38.8 MiB, 648 hits)

  Yahoo! Astra 组件源文件(百度网盘) (38.8 MiB, 539 hits)

在Flex或纯AcitonScript项目中使用Flash组件

2014-03-10更新:更新FlashCC自带的组件;
2010-12-19更新包含Alert、MenuBar等更多组件的Flash组件
2011-08-21更新:加入Flash CS 5.5 的UI组件编译的SWC,原因见正文。


在纯AS环境下做开发的时候,往往需要一些简单的UI组件支持,例如按钮、复选框等等。这时候就需要选择或者自行开发一套常用的UI组件库,我在Flash&Flex大全中介绍了一些可以用于纯AS环境开发的第三方组件库,但一直没有介绍Flash的组件。现在看来,在纯AS项目中使用Flash的组件,至少有以下三个好处:

  1. 完善的中文文档
  2. 有大量参考资料;
  3. 有丰富的免费皮肤;
  4. 生成的文件较小,只有使用了的组件才会被导出。

至于Flex,它已经有了完善且更加高级的组件库,而且也包含上面1-3条优点,所以采用Flex框架开发,当然还是用Flex组件比较好。这里只是提供一种方法罢了。

Flash组件位于安装目录下的“Common\Configuration\Components\”目录中(Flash CS3则在“zh_cn\Configuration\Components\“)。其中“User Interface.fla”为源文件,只需要用Flash打开这个文件,在发布设置中选中“导出SWC”然后导出,就可以得到一个119KB的SWC文件。将其复制到AS项目的“libs”文件夹即可,也可以直接在Flash Builder中的AS项目的属性中设置“Actionscript构建路径-库路径-添加SWC文件夹/添加SWC“。

Flash CS3/CS4/CS5所带的UI组件是完全一样的。UI组件的源码在“User Interface.fla”的库面板中的“Component Assets/_private/ComponentShim”中,这是一个编译剪辑,因此看不到源码。它们的真实源码在“Common\Configuration\Component Source\ActionScript 3.0\User Interface\”文件夹中,完全由AS3写成。

从CS5开始,由于增加了新的FTE文本引擎和TLF框架,Flash也提供了一个TLFTextField组件。相应的,UIScrollBar.scrollTarget也发生了改变。原来的类型是TextField,现在可以接受TextField和FTETextField。因此,原来提供的SWC中的UIScrollBar组件就不能支持FTETextField。因此这里提供了Flash CS 5.5版本的UI组件。

FlashCS3提供的UI组件编译的SWC下载(不支持FTETextField):

  FlashUI.swc (116.5 KiB, 3,067 hits)
FlashUI组件,可用于纯Actionscript项目和Flex项目。

FlashCS5.5提供的UI组件编译的SWC下载(支持FTETextField):

  FlashUI5.5.swc (124.1 KiB, 1,911 hits)
基于Flash CS5.5中提供的UI组件制作的SWC,可以用于纯AS3项目。

在纯AS3项目中使用,还需要这个SWC提供FTETextField支持:

  tlfruntime.swc (195.2 KiB, 1,749 hits)
提供TLFTextField组件支持。


2014-03-10 更新:

Raymond 同学使用 FlashCC 编译了 几个SWC,放在这里提供给有需要的朋友:

  1. FlashUI_CC.swc 来自于 xxx\Adobe\Adobe FlashCC\Common\Configuration\Components 目录下的User Interface.fla ,发布目标 是FlashPlayer10.3;
  2. Video 来自于同一个目录路径的Video.fla ,同样的发布参数;
  3. tlfRuntime_cc.swc 和 textLayout.swc 来自于 xxx\Adobe\Adobe FlashCC\Common\Configuration\TLFConversion 目录下 Adobe 已经编译好的SWC文件。用于Text Layout Framework支持。

  FlashCCUI (780.2 KiB, 1,014 hits)