创建Flash CS3组件(五) 组件的实时预览

 

创建Flash CS3组件(五) 组件的实时预览
实时预览,可以说是组件的一大特色,它可以一定程度上让用户直观的了解到组件所作的更改,相当的好用.

1.一种简单的实现实时预览的方法
在已经完成的组件上点右键,选择导出swc文件,将组件导出成一个swc文件,然后用WinRAR打开这个swc文件(没错,的确可以打开),你会看到里面有一个catalog.xml和library.swf.其中,catalog.xml是swc的定义文件,里面是所有类的定义.而library.swf就是flash自动生成的实时预览文件,将它改个名字,就可以直接当实时预览来用了.

2.实时预览是如何实现的
实时预览文件其实就是一个包含有组件的swf文件,但是与普通的文件不同的一点是它的文档类是fl.livepreview.LivePreviewParent.当组件发生改变时,flash会与LivePreviewParent通信,然后由LivePreviewParent类来改变组件的相关属性.
根据LivePreviewParent类,我们知道了在实时预览时,如果组件的大小变化了,LivePreviewParent会调用组件的setSize方法来设置大小,如果没有setSize方法就直接设置width和height属性.如果组件的参数变化了,LivePreviewParent会直接为相应属性赋值.
有两点细节要注意:
一是实时预览只对大小和组件参数的改变作反应,其它的所有属性(位置,旋转,样式...)都对实时预览无效
二是实时预览直接对组件参数赋值,而不是调用相关方法.

3.制作简单的实时预览
制作一个简单的swf文件很简单:新建一个fla文件,把文档类设为fl.livepreview.LivePreviewParent,然后把组件拖到场景中,确保组件的所有设置都是默认值,最后发布 -- 搞定!

4.制作更高级的实时预览
在组件中,总有一些东西不应该出现在实时预览中,比如Accordion组件载入的子项.准确的说,所有组件里面包含之外的元件,包括图标,载入的文件等等,都不应该出现在实时预览中,否则可能会导致未知的问题.
所以,在组件中就应当使用checkLivePreview():Boolean方法(继承自UIComponent)来检测是否处于实时预览状态中,然后特殊对待.
对于载入的外界元件,在实时预览中可以不载入,也可以载入一个内置的元件来代替它.
例如
if(checkLivePreview()){
 //在这里插入实时预览时的代码
}

5.精简实时预览
如果你觉得实时预览太大,可以将实时预览链接至另一个类,而这个类是一个精简版,仅仅实现了实时预览所需要的方法与属性.这样就实现了组件与实时预览的分开,很方便于修改.
实时预览可以精简所有与组件参数无关的属性和方法,可以将所有监听器去掉(实时预览时是不用事件的),还有可以将样式改成不可更改的,这样就更加简化了代码.
最终简化的实时预览,请见附件中com.cyjb.livePreview.LivePreview_Accordion.as

到目前为止,创建Flash CS3组件系列就告一段落,对于组件方面还有什么问题,可以给我留言,或者发邮件:f8cyjb@126.com