论文部分内容阅读
摘要:文章分析了Flash类绑定的基本原理,探讨了类绑定的几种方式和优缺点,并通过代码演示了类绑定的技巧,总结出在RIA项目开发中,采用类绑定是美工和代码分离的重要途径,既保证了界面友好和代码逻辑完整,也可以提高整个开发效率。
关键词:Flash;类绑定;代码;元件
中图分类号:TP311文献标识码:A文章编号:1009-3044(2012)09-2039-03
Class-binding Mechanism’s Research and Application in Flash
WANG Ying
(Zhengzhou Financial Technician Institute, Zhengzhou 450013, China)
Abstract: The article analyzes the Flash class of binding of the basic principles discussed several advantages and disadvantages of the class bind, demonstrated through the code, binding techniques, summed up in the RIA project development, by using the binding is the art andan important way to separate code, both to ensure a friendly interface and complete code logic, can also improve the development efficiency.
Key words: Flash; class-binding; code; component
当前,互联网带宽不断提高,各类RIA层出不穷,在应用中融入更多的交互式动画元素显得越来越重要。交互式动画需要解决美工元素和控制代码相互配合的问题,不仅要求界面友好带给人们愉快的视觉享受,同时要做到所执行的代码逻辑完整,与显示对象完美结合。在Flash创作工具中,类绑定是实现动画和脚本相结合的主要方法,采用类和库中的元件绑定是目前业界标准的通用做法,可以使动画中的影片剪辑具有像程序一样的模块功能。一旦某个影片剪辑与类绑定后,该剪辑将被视为类的实例,影片中的子显示对象和帧都可以被类定义中的代码控制。从应用层面看,一个类不仅可以与多个库元件绑定,实现代码集中管理,同时,一个元件也可以重复绑定多个不同的类,实现不同阶段的不同显示效果;从项目层面看,类绑定使得设计人员和脚本开发人员可以相对独立的专注于自己的工作,减轻双方劳动量,提高工作效率。
1类绑定的原理
从Flash CS3引入了ActionScript3.0后,库中的元件都被看成是某个类的实例,即影片剪辑与某个MovieClip子类进行了绑定。即使没有指定具体绑定类,编译系统也会自动生成一个MovieClip类与之绑定。其原理为,如果影片剪辑类元件在满足没有指定绑定类,帧中没有加入脚本,没有手工输入子元件的name属性的条件下下,编译器就将该元件作为一个普通的MovieClip对象进行编译;如果不符合上述条件编译器则自动生成一个MovieClip子类,将舞台上的剪辑元件编译成该类的实例。该类的类名默认为“文档名::库元件名_数字”。例如:某文档命名为“示例文档.fla”,在其中新建一个影片剪辑类元件“示例剪辑”,“示例剪辑”的任意帧中包含代码“stop()”,那么编译器会将舞台上的该剪辑编译成“示例文档::示例剪辑_数字”类的实例,而“示例剪辑_数字”类是继承自MovieClip的子类。此外,不仅可以绑定库中的元件,整个舞台(stage)甚至SWF文件也可以实现类绑定,这是因为可以把flash中的舞台看成是一个大的容器对象,而事实上舞台容器也是显示列表中的根容器,舞台容器被看成是Stage类的实例。SWF文件可以被看成SWF主类的实例,当类绑定SWF文件时,类被称为文档类,文档类是类绑定的一个特例。如果SWF没有指定文档类,那么编译器会自动生成一个MainTimeLine的类与之绑定。如果设计元素是交互动画的外壳,那么类绑定则赋予其灵魂。
在Flash创作工具中,即可以将动作脚本写入影片剪辑的关键帧中,也可以写在绑定类中。那么,帧代码和绑定类的适用范围是什么呢?一般来讲,应遵循以下原则,凡是和影片结构、播放流程相关的代码都应写在关键帧中,而与影片结构无关的代码写在绑定类中。当然,在实际应用中要灵活处理,例如,在某绑定类绑定多个影片剪辑的时候,要求所有的剪辑播放到一定帧的时候都执行共同的播放控制类代码,这时候就应将代码写入绑定类,通过代码对不同剪辑实现统一管理,因为这是绑定类的通用要求,并不针对某一特定影片剪辑。
在Flash CS3及以上版本中,库中创建的原件一般默认为基于MovieClip类。但是如果一个影片剪辑类元件只有一帧而不需要时间轴播放支持,则没有必要使用MovieClip类,可以采用更轻量级的Sprite类,这样做的好处在于不但节省资源,还可以使代码意图更加明显。具体做法为,右键单击库中的元件,选择属性,在弹出的对话框中勾选“为ActionScript导出”,然后在基类文本框中输入“flash.display.Sprite”,点击确定按钮即可将元件绑定为Sprite类的子类。
2类绑定的方法
类绑定的方法有两类,一类最常用的是自动生成绑定绑定,二是手工编写绑定的类文件。
在ActionScript2.0时代可以通过链接标识符来实现使用代码在舞台上显示库元件,在AS3.0已经不存在链接标识符的概念,可以通过下述方法来实现绑定并显示元件。右键单击库中元件A,在弹出的对话框中选择“为ActionScript”导出,这时类名默认与元件名一致且继承自MovieClip类,编译时,会自动生成一个同名类A,然后类A会和元件A绑定,生成类A的对象并加入显示列表,舞台上会根据代码要求出现库元件A的实例。关键帧代码如下:
Var a:A=new A;addChild(a);a.x=100;a.y=100;
如果不希望绑定类与库元件同名,可以在类名文本框中输入自定义名称。这种自动生成的类绑定好处在于简单,不必再手工创建独立的类文件,缺点是不能对库元件做任何修改,也不能添加任何新的属性。
如果希望通过类绑定对库元件进行更多的操作,如添加属性和控制对象行为,就需要手工编写外部类文件。一般情况下,一个库元件只允许和一个类文件进行绑定,若要多个元件实现共同的行为,就要编写不同的对应类文件,否则会造成编译错误,这种做法不符合面向对象代码复用的原则。如果希望用一个类文件,控制不同的库元件行为,又不造成编译器报错,可以采用类继承的方式,首先将所有元件都要实现的相同方法和属性写入一个基类,各元件的绑定类都继承自该类,然后由编译器自动实现类绑定。例如:存在一个CarMove.fla文件,其中有两辆汽车CarA和CarB,希望这两辆汽车的实例实现从舞台左侧到右侧的移动。首先编写一个基类CarMoveMC实现两辆汽车的共同属性“speed”,然后将库中的两个汽车元件“为ActionScript导出”,类名为CarA和CarB,都以CarMoveMC为基类。基类代码如下:
//CarMove.fla与CarMoveMC.as都在根目录中
package{
import flash.display.MovieClip;
import flash.events.Event;
public class CarMoveMC extends MovieClip
{private var _speed:Number = 1;
//speed是两辆汽车的共同属性
public function CarMoveMC (){
super();
addEventListener(Event.ENTER_FRAME, move);
}
public function set speed(nS:Number):void {
_speed = nS;
}//控制汽车移动的速度
private function move(evt:Event):void {
this.x -= _speed;
}}}
为舞台根容器编写一个文档类,实现显示类表子对象的显示,即让CarA和CarB的实例在舞台上显示,并显示出相同的speed属性。文档类的DisplayCar.as文件与CarMove.fla也在同一根目录中,代码如下:
//as与fla在同一目录下,不必写包路径
package
{import flash.display.Sprite;
import flash.utils.getDefinitionByName;
public class DisplayCar extends Sprite
{private var __CarA:Class; private var __CarB:Class;
//背景
private var __Bg:Class;
public function DisplayCar () {
initDisplay();
var bg:Sprite = new __Bg();//背景为单帧,以Sprite为基类
//三辆汽车,都继承自基类CarMoveMC
var carA1: CarMoveMC= new __CarA();
var carA2: CarMoveMC= new __CarA();
var carB : CarMoveMC= new __CarB();
//设置三辆汽车的位置、大小、速度和透明度
carA1.speed = 1.5;
carA1.x = 300;
carA2.speed = 1;
carA2.scaleX = 0.5;
carA2.scaleY = 0.5;
carA2.x = 200;
carA2.y = 125;
carA2.alpha = 0.5;
carB.y = 150;
carB.x = 500;
carB.speed = 0.5;
//将汽车对象加入显示列表
addChild(bg);
addChild(cloudB);
addChild(cloudABig);
addChild(cloudASmall);
}private function initDisplay():void {
__CarA = getDefinitionByName("CarA") as Class;
__CarB = getDefinitionByName("CarB") as Class;
__Bg = getDefinitionByName("Bg") as Class;}}}
3绑定类访问影片剪辑子元件的方法
在绑定类中,可以用代码直接控制影片剪辑内的各种子显示内容,例如在某个影片剪辑内存在一个子剪辑child_mc,那么可以通过child_mc.play()实现子剪辑的播放。通过绑定类访问剪辑子元件的方法有两种:自动声明和手工声明。
自动声明的原理是,编译器为绑定类的类体中和构造函数中自动加上一行代码:
public var child_mc:MovieClip//类体
child_mc=getChildByName(“child_mc”);//构造函数
这种自动声明的优点在于简单易行,开发人员不必关心影片剪辑内的字显示内容的声明,一切由编译器完成;缺点在于,如果其他ActionScript3 IDE使用这种剪辑的时候,则会提示出错,从而掩盖其他更重要的错误。
手工声明子剪辑的方法是,首先在flash的文件菜单中选择“发布设置”,其次在“flash”选项卡中点击脚本“设置”按钮,然后取消“自动声明舞台实例”的状态。取消自动声明后,需要在绑定类中手工写入子剪辑的属性,而且这个属性必须和影片子剪辑同名,访问控制为public。这种方法可以被其他IDE识别且不会报错,但是存在两个问题。第一个问题是,有可能会造成类定义的封装被破坏,如果我们不希望子剪辑元件对外部可见,应该尽量减少不必要的公共属性和方法。第二是代码与元件之间耦合度太高,手工声明时要求这个public属性和子剪辑同名,一旦子剪辑命名改变,类文件中的相关代码也要更改,如果涉及到的代码比较多,缺乏可维护性。
为解决上述两个问题,可以将子剪辑的引用赋值给新增private属性,再对新增属性进行操作,以此避免属性对外部可见。这里需要使用as关键字对子剪辑的引用进行类型转换为新增属性类型。示例如下:
public class Sample extends MovieClip
{private var __child_mc:MovieClip;//新增属性
public function Sample() {
initDisplay();
}
private function initDisplay():void {
__child_mc = getChildByName("child_mc") as MovieClip;//用as转换
} }
这样,即实现了元件与代码的脱耦,也保护了类的封装。
4总结
类绑定是实现美工与代码分离的重要途径,降低了设计和开发人员双方的工作量,可以使其更专注于各自的工作,保证了界面美观和代码质量,同时也提高了整个RIA项目开发的效率。
参考文献:
[1]杨鹏飞.基于Flash的电子白板的设计与实现[J].电脑知识与技术, 2011,8(2):432-435.
[2]王愉.Flash ActionScript3.0溢彩编程[M].北京:清华大学出版社,2010.
[3]孙颖.Flash ActionScript3殿堂之路[M].北京:电子工业出版社,2007.
关键词:Flash;类绑定;代码;元件
中图分类号:TP311文献标识码:A文章编号:1009-3044(2012)09-2039-03
Class-binding Mechanism’s Research and Application in Flash
WANG Ying
(Zhengzhou Financial Technician Institute, Zhengzhou 450013, China)
Abstract: The article analyzes the Flash class of binding of the basic principles discussed several advantages and disadvantages of the class bind, demonstrated through the code, binding techniques, summed up in the RIA project development, by using the binding is the art andan important way to separate code, both to ensure a friendly interface and complete code logic, can also improve the development efficiency.
Key words: Flash; class-binding; code; component
当前,互联网带宽不断提高,各类RIA层出不穷,在应用中融入更多的交互式动画元素显得越来越重要。交互式动画需要解决美工元素和控制代码相互配合的问题,不仅要求界面友好带给人们愉快的视觉享受,同时要做到所执行的代码逻辑完整,与显示对象完美结合。在Flash创作工具中,类绑定是实现动画和脚本相结合的主要方法,采用类和库中的元件绑定是目前业界标准的通用做法,可以使动画中的影片剪辑具有像程序一样的模块功能。一旦某个影片剪辑与类绑定后,该剪辑将被视为类的实例,影片中的子显示对象和帧都可以被类定义中的代码控制。从应用层面看,一个类不仅可以与多个库元件绑定,实现代码集中管理,同时,一个元件也可以重复绑定多个不同的类,实现不同阶段的不同显示效果;从项目层面看,类绑定使得设计人员和脚本开发人员可以相对独立的专注于自己的工作,减轻双方劳动量,提高工作效率。
1类绑定的原理
从Flash CS3引入了ActionScript3.0后,库中的元件都被看成是某个类的实例,即影片剪辑与某个MovieClip子类进行了绑定。即使没有指定具体绑定类,编译系统也会自动生成一个MovieClip类与之绑定。其原理为,如果影片剪辑类元件在满足没有指定绑定类,帧中没有加入脚本,没有手工输入子元件的name属性的条件下下,编译器就将该元件作为一个普通的MovieClip对象进行编译;如果不符合上述条件编译器则自动生成一个MovieClip子类,将舞台上的剪辑元件编译成该类的实例。该类的类名默认为“文档名::库元件名_数字”。例如:某文档命名为“示例文档.fla”,在其中新建一个影片剪辑类元件“示例剪辑”,“示例剪辑”的任意帧中包含代码“stop()”,那么编译器会将舞台上的该剪辑编译成“示例文档::示例剪辑_数字”类的实例,而“示例剪辑_数字”类是继承自MovieClip的子类。此外,不仅可以绑定库中的元件,整个舞台(stage)甚至SWF文件也可以实现类绑定,这是因为可以把flash中的舞台看成是一个大的容器对象,而事实上舞台容器也是显示列表中的根容器,舞台容器被看成是Stage类的实例。SWF文件可以被看成SWF主类的实例,当类绑定SWF文件时,类被称为文档类,文档类是类绑定的一个特例。如果SWF没有指定文档类,那么编译器会自动生成一个MainTimeLine的类与之绑定。如果设计元素是交互动画的外壳,那么类绑定则赋予其灵魂。
在Flash创作工具中,即可以将动作脚本写入影片剪辑的关键帧中,也可以写在绑定类中。那么,帧代码和绑定类的适用范围是什么呢?一般来讲,应遵循以下原则,凡是和影片结构、播放流程相关的代码都应写在关键帧中,而与影片结构无关的代码写在绑定类中。当然,在实际应用中要灵活处理,例如,在某绑定类绑定多个影片剪辑的时候,要求所有的剪辑播放到一定帧的时候都执行共同的播放控制类代码,这时候就应将代码写入绑定类,通过代码对不同剪辑实现统一管理,因为这是绑定类的通用要求,并不针对某一特定影片剪辑。
在Flash CS3及以上版本中,库中创建的原件一般默认为基于MovieClip类。但是如果一个影片剪辑类元件只有一帧而不需要时间轴播放支持,则没有必要使用MovieClip类,可以采用更轻量级的Sprite类,这样做的好处在于不但节省资源,还可以使代码意图更加明显。具体做法为,右键单击库中的元件,选择属性,在弹出的对话框中勾选“为ActionScript导出”,然后在基类文本框中输入“flash.display.Sprite”,点击确定按钮即可将元件绑定为Sprite类的子类。
2类绑定的方法
类绑定的方法有两类,一类最常用的是自动生成绑定绑定,二是手工编写绑定的类文件。
在ActionScript2.0时代可以通过链接标识符来实现使用代码在舞台上显示库元件,在AS3.0已经不存在链接标识符的概念,可以通过下述方法来实现绑定并显示元件。右键单击库中元件A,在弹出的对话框中选择“为ActionScript”导出,这时类名默认与元件名一致且继承自MovieClip类,编译时,会自动生成一个同名类A,然后类A会和元件A绑定,生成类A的对象并加入显示列表,舞台上会根据代码要求出现库元件A的实例。关键帧代码如下:
Var a:A=new A;addChild(a);a.x=100;a.y=100;
如果不希望绑定类与库元件同名,可以在类名文本框中输入自定义名称。这种自动生成的类绑定好处在于简单,不必再手工创建独立的类文件,缺点是不能对库元件做任何修改,也不能添加任何新的属性。
如果希望通过类绑定对库元件进行更多的操作,如添加属性和控制对象行为,就需要手工编写外部类文件。一般情况下,一个库元件只允许和一个类文件进行绑定,若要多个元件实现共同的行为,就要编写不同的对应类文件,否则会造成编译错误,这种做法不符合面向对象代码复用的原则。如果希望用一个类文件,控制不同的库元件行为,又不造成编译器报错,可以采用类继承的方式,首先将所有元件都要实现的相同方法和属性写入一个基类,各元件的绑定类都继承自该类,然后由编译器自动实现类绑定。例如:存在一个CarMove.fla文件,其中有两辆汽车CarA和CarB,希望这两辆汽车的实例实现从舞台左侧到右侧的移动。首先编写一个基类CarMoveMC实现两辆汽车的共同属性“speed”,然后将库中的两个汽车元件“为ActionScript导出”,类名为CarA和CarB,都以CarMoveMC为基类。基类代码如下:
//CarMove.fla与CarMoveMC.as都在根目录中
package{
import flash.display.MovieClip;
import flash.events.Event;
public class CarMoveMC extends MovieClip
{private var _speed:Number = 1;
//speed是两辆汽车的共同属性
public function CarMoveMC (){
super();
addEventListener(Event.ENTER_FRAME, move);
}
public function set speed(nS:Number):void {
_speed = nS;
}//控制汽车移动的速度
private function move(evt:Event):void {
this.x -= _speed;
}}}
为舞台根容器编写一个文档类,实现显示类表子对象的显示,即让CarA和CarB的实例在舞台上显示,并显示出相同的speed属性。文档类的DisplayCar.as文件与CarMove.fla也在同一根目录中,代码如下:
//as与fla在同一目录下,不必写包路径
package
{import flash.display.Sprite;
import flash.utils.getDefinitionByName;
public class DisplayCar extends Sprite
{private var __CarA:Class; private var __CarB:Class;
//背景
private var __Bg:Class;
public function DisplayCar () {
initDisplay();
var bg:Sprite = new __Bg();//背景为单帧,以Sprite为基类
//三辆汽车,都继承自基类CarMoveMC
var carA1: CarMoveMC= new __CarA();
var carA2: CarMoveMC= new __CarA();
var carB : CarMoveMC= new __CarB();
//设置三辆汽车的位置、大小、速度和透明度
carA1.speed = 1.5;
carA1.x = 300;
carA2.speed = 1;
carA2.scaleX = 0.5;
carA2.scaleY = 0.5;
carA2.x = 200;
carA2.y = 125;
carA2.alpha = 0.5;
carB.y = 150;
carB.x = 500;
carB.speed = 0.5;
//将汽车对象加入显示列表
addChild(bg);
addChild(cloudB);
addChild(cloudABig);
addChild(cloudASmall);
}private function initDisplay():void {
__CarA = getDefinitionByName("CarA") as Class;
__CarB = getDefinitionByName("CarB") as Class;
__Bg = getDefinitionByName("Bg") as Class;}}}
3绑定类访问影片剪辑子元件的方法
在绑定类中,可以用代码直接控制影片剪辑内的各种子显示内容,例如在某个影片剪辑内存在一个子剪辑child_mc,那么可以通过child_mc.play()实现子剪辑的播放。通过绑定类访问剪辑子元件的方法有两种:自动声明和手工声明。
自动声明的原理是,编译器为绑定类的类体中和构造函数中自动加上一行代码:
public var child_mc:MovieClip//类体
child_mc=getChildByName(“child_mc”);//构造函数
这种自动声明的优点在于简单易行,开发人员不必关心影片剪辑内的字显示内容的声明,一切由编译器完成;缺点在于,如果其他ActionScript3 IDE使用这种剪辑的时候,则会提示出错,从而掩盖其他更重要的错误。
手工声明子剪辑的方法是,首先在flash的文件菜单中选择“发布设置”,其次在“flash”选项卡中点击脚本“设置”按钮,然后取消“自动声明舞台实例”的状态。取消自动声明后,需要在绑定类中手工写入子剪辑的属性,而且这个属性必须和影片子剪辑同名,访问控制为public。这种方法可以被其他IDE识别且不会报错,但是存在两个问题。第一个问题是,有可能会造成类定义的封装被破坏,如果我们不希望子剪辑元件对外部可见,应该尽量减少不必要的公共属性和方法。第二是代码与元件之间耦合度太高,手工声明时要求这个public属性和子剪辑同名,一旦子剪辑命名改变,类文件中的相关代码也要更改,如果涉及到的代码比较多,缺乏可维护性。
为解决上述两个问题,可以将子剪辑的引用赋值给新增private属性,再对新增属性进行操作,以此避免属性对外部可见。这里需要使用as关键字对子剪辑的引用进行类型转换为新增属性类型。示例如下:
public class Sample extends MovieClip
{private var __child_mc:MovieClip;//新增属性
public function Sample() {
initDisplay();
}
private function initDisplay():void {
__child_mc = getChildByName("child_mc") as MovieClip;//用as转换
} }
这样,即实现了元件与代码的脱耦,也保护了类的封装。
4总结
类绑定是实现美工与代码分离的重要途径,降低了设计和开发人员双方的工作量,可以使其更专注于各自的工作,保证了界面美观和代码质量,同时也提高了整个RIA项目开发的效率。
参考文献:
[1]杨鹏飞.基于Flash的电子白板的设计与实现[J].电脑知识与技术, 2011,8(2):432-435.
[2]王愉.Flash ActionScript3.0溢彩编程[M].北京:清华大学出版社,2010.
[3]孙颖.Flash ActionScript3殿堂之路[M].北京:电子工业出版社,2007.