探索Actionscript3.0 flash9 Preview

者: egoldy

性质: 翻译

阅读次数: 36632

发表时间: 2006-06-29 17:00:45

声明：本教程英文版源自Adobe的：http://www.adobe.com/devnet/flash/articles/flash9_as3_preview.html原作者：Jen deHaan和Peter deHaan,本站对其进行了翻译整理，此教程转载请注明出处．并标有活动链接，谢谢合作．

      Adobe Flash Professional 9 ActionScript 3.0 Preview(以下简称AS3.0预览版)是下一个将要发布的flash 创作工具的预览。众所周知它的名字是”Blaze”,它扩展了Flash Professional 8 并包括了一系列特性将与Flash9 一同发布，计划将在2007年发布。 
    这个预览版本包括支持Actionscript 3.0,它的优势在于包含在flash player 9 中的一个新的虚拟机(AVM)，这个增强的虚拟机要比传统的Actionscript 代码的执行速度快上10倍，如果你想获得更多的关于flash player 9的信息，请查看Flash Player Product page 
       Flash9预览版允许你编译包含或导入到Fla中的Actionscript3.0 脚本，贴加在帧上或是与库元件关联的脚本在编译过程加入与场景内容的交互。 
    这篇文章是通过使用Flash的绘制工具创建一个新的形体来展开的，当你学完了如果让形体与按钮和鼠标交互移动，你会明白如果将actionscript从主时间轴上移到外部文件，怎样与库中的元件或是Flash文档自身链接。 
    要完成此文章你需要Flash Professional 9 Actionscript 3.0 和范例文件 

在FLASH中编写Actionscript 3.0 

      Flash9 预览版只是一个开发环境，它允许你创建Flash文档(FLA)并使用Actionscript 3.0,当然你也可以使用Flex Builder 2来编译As3.0. 
Flash9预览版能让你创建基于时间线的Actionscript3.0文档，并可以使用其它的一些特性，如形变和运动缓 动，flash.display.MorphShape类，abobe.utils package,static text fields,scenes,和库。 
Flash9 预览版包括下面几个新特性: 
1.Document class: 
Flash9引入了document class的概念，定义为与你的swf文件的主时间线关联的类。当你初始化主时间线时，document class就已经被构造了。你可以文件的属性面板或Actionscript 3.0发布设置面板上设置document class,如：File>Publish Settings > Flash tab > Settings button 
如下图：

2.Symbol-class linkage: (元件-类链接) 
在ActionScript 3.0中你不再需要链接id了，取而代之的是，你可以为你能直接实例化或动态创建实例的元件指定一个特定的类名称。如下图所示：

3.如果类不能在你指定的类路径当中找到，那么Flash会在场景之后创建一个以使它仍可以被实例化。如下图所示：

4.Errors and warnings: （错误和警告） 
针对ActionScript 3.0 errors和warnings增加了两个操作.你可以在Actionscript 3.0的特性面板上选择。如：选择Edit>Preferences > ActionScript > Actionscript 3.0设置按钮。如下图。 
—个是Strict Mode,使编译器在编译过程中遇到问题时非常的严格，都会当做错误来处理而不是警告。另一个是Warnings Mode,会出现额外的警告，大多数情况下当你从Actionscript 2.0迁移到As3.0时，会起到很大的帮助，当你选择了Warning时，你可以通过编辑EnabledWarnings.xml文件中的 Enabled属性来定义你想要的警告。EnabledWarnings.xml文件的位置： 
o Windows: C:Program FilesAdobeFlash 9 Public AlphaenConfigurationActionScript 3.0EnabledWarnings.xml 
o Mac OS: HD|Applications|Adobe Flash 9 Public Alpha|Configuration|ActionScript 3.0|EnabledWarnings.xml

Creating clickable and draggable shapes（创建可点击和可拖动的形体） 

      在这个例子中，你将探索flash9 预览版了一些新特性，你将创建一个简单的形体并使用改良的事类模型来使它可以点击,在后面的例子中，你将使这个形体可以拖动，将你的代码转换为类和动态创类的实例。 

Clickable shapes(可点击的形体) 

下面我们先开始创建一个可以点击的形体。 
1. 选择文件>新建一个文档，并将它保存为simpleBall.fla. 
2. 选择绘制圆工具，在场景中绘制一个正圆。当然在绘制的时候按住shift就可以了。 
注意：在绘制时候确何你的Object Drawing mode（对象绘模式）是关闭的。 
3．选中选择工具并双击这个形体使它高亮显示 
4.  当这个形体选中后，选择编辑modify>Convert to Symbol转换为元件(按F8)来打开元件转换窗口， 
5．将名称改为circle然后点击ok,将它转换为影片剪辑。 
6． 元件要仍处于选中的状态，在属性面板上为它起一个实例名为：ball_mc 
7． 取消对元件的选择打开action面板(F9). 
8．在Action面板上输入如下代码：

ball_mc.addEventListener(MouseEvent.CLICK, clickHandler);function clickHandler(event:MouseEvent):void {   trace("You clicked the ball");}

在这段代码中，ball_mc实例变成了可以点击的了，因为你加入了事件侦听用来检测用户是否有点击动作，无论何时只要用户点击了ball_mc影片剪 辑，clickHandler()函数就会执行。这非常类似于之前版本在组件中加入侦听事件，如As2.0使用onPress()事件来检测用户是否点击 了剪辑或按钮。 
9．选择Control>Test Movie 测试影片，当你点击圆时，就会在面板上输出”you clicked the ball. 
10．关闭Swf文件返回Flash操作环境，编辑你的Actionscript 代码，在原有代码的上面加入如下一行代码： 
ball_mc.buttonMode = true; 
11．重新测试你的影片,当你的光标位于圆之上时，光标就会变成一只小手的形状。用于给用户一个提示，这是可以点击的。 

Draggable shapes(可拖动的形体) 

      如果你想让用户可以在场影中拖动这个形体，你需要加入两个事性侦听器，mouseDown(MouseEvent.MOUSE_DOWN)和mouseUp(MouseEvent.MOUSE_UP),如下面的例子。 
下面的例子示范如何为mouseDown和mouseUp事件加入事件侦听器 
1.编辑我们之前的例子中代码如下：

ball_mc.buttonMode = true;ball_mc.addEventListener(MouseEvent.CLICK, clickHandler);ball_mc.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownListener);ball_mc.addEventListener(MouseEvent.MOUSE_UP, mouseUpListener);function clickHandler(event:MouseEvent):void {  trace("You clicked the ball");}function mouseDownListener(event:MouseEvent):void {   ball_mc.startDrag();}function mouseUpListener(event:MouseEvent):void {   ball_mc.stopDrag();} 

2.测试你的影片。你就可拖动这个圆了。 
虽然我们编写这个例子没有花费我们多少时间，但如果再让你写一个可拖动的形体，你可能不会情愿去写，假想你能将你的代码转换为与元件连接的外部类文件,它可以自动的创建可拖动的形体，会在将来结省你的大量时间。下面我们就看如何实现。 

Converting code into a class(将你的代码转换成类) 

下面的例子创建一个Actionscript类它封装整个影片剪辑的拖动的实现逻辑。现在不管什么时候，只要创建一个类的新的实例被创建，它就是可拖动的。无须为场景中的每个实例去写代码。 
1.创建一个新的Fla文档并将它保存为fancyBall.fla. 
2.选择File>New选择Actionscript File创建一个新的Actionscript文件。 
3.保存这个Actionscript文件为Ball.as与Fla文件为同一路径下。也就是刚才创建的fancyBall.fla. 
4. 在里面输入如下代码：

package {  import flash.display.MovieClip;   import flash.events.MouseEvent;   public class Ball extends MovieClip {      public function Ball() {         trace("ball created: " + this.name);         this.buttonMode = true;         this.addEventListener(MouseEvent.CLICK, clickHandler);         this.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownListener);         this.addEventListener(MouseEvent.MOUSE_UP, mouseUpListener);      }      private function clickHandler(event:MouseEvent):void {         trace("You clicked the ball");      }      function mouseDownListener(event:MouseEvent):void {        this.startDrag();      }      function mouseUpListener(event:MouseEvent):void {         this.stopDrag();      }   }} 

       上面的代码定义了一个新类名为Ball,它继承了MovieClip类(内置在flash.display package中).注意在使用As3.0书写外部类时，你必须明确的导入所需要类。不同于在Fla内部书写代码。 
5．保存并关闭Ball.as文档，然后打开fancyBall.fla文档。 
6. 使用绘制圆工具，在场景中绘制一个圆并将转换为movieClip. 
7．右击刚刚建立的圆，选择链接。 
8．选择Export for ActionScript(为action导出)，在Class(类)的输入框中输入类名Ball 
9．点击ok.关闭此面板。 
10．确何这个圆的实例在场景中，测试影片。观看是否与之前的效果是一样的。 
它看起来很不错，下面的例子我们来看如何动态的创建类实例。 

Dynamically creating instances of a class（动态创建类实例） 

      你不需要在创作时总是将元件拖动到场景中，你也可以通过使用Actionscirpt新操作方法在库中创建新的类实例。 

Using the new operator（使用新的操作） 

     之前的Actionscript在创建新的MovieClip或是TextField实例时是通过使用如 MovieClip.attachMovie(),MovieClip.createEmptyMovieClip(),或 MovieClip.createTextField().来创建的。在ActionScript 3.0中，你可以通过类似如new Ball()的方法创建新的MovieClip,TextField,Sprite,和Video 实例—或是你自定义的类，如下方法： 
1.打开fancyBall.fla.将场景中的所有实例元件删去，在主时间线上加入如下代码：

var b1:Ball = new Ball();

2.按下ctrl +回车测试，注意，我们会发现没有任何东西出现在场景中，但是在输出面板上会显示：“ball created: instance1”,尽管Flash创建了ball的一个新的实例，但它是不可视的，因为你没有使用addChild()将它加入到显示列表中。 
3.编辑代码，将b1实例加入到显示列表中。测试。

addChild(b1);

     下一部你需要使用document class,它将允许你将代码从主时间轴的第一帧上移到一个外部文档中，它类似与之前例子中的通过元件与类连接. 

Using the Document Class text box(使用Document class输入框) 

下面示范如何将你的代码从主时间轴移到一个外部的As文件中。 
1.删去fancyBall.fla第一帧上的代码。 
2.创建一个新的Actionscript文档保存为BallDocumentClass.as，与fancyBall.fla处于同一目录下。 
3.加入如下代码在BallDocumentClass.as中：

package {   import flash.display.MovieClip;   public class BallDocumentClass extends MovieClip {      private var tempBall:Ball;      private var MAX_BALLS:uint = 10;      public function BallDocumentClass() {         var i:uint;         for (i = 0; i < MAX_BALLS; i++) {            tempBall = new Ball ();            tempBall.scaleX = Math.random();            tempBall.scaleY = tempBall.scaleX;            tempBall.x = Math.round(Math.random() * (this.stage.stageWidth - tempBall.width));            tempBall.y = Math.round(Math.random() * (this.stage.stageHeight - tempBall.height));            addChild(tempBall);         }          }   }} 

4.保存并关闭这个as文档，打开fancyBall.fla. 
5.在属性面板的document class后面的输入框中输入BallDocumentClass，保存文件。 
6.测试，你会发现有10个大小位置不同的元件出现在场景中。 
使用Document Class允许你将代码放置在外部文件中，而不是时间线上，可以在许许的fla文件重用代码，并且在团队协作版本控制系统(CVS)中,更容易共享代码。 

总结： 

       这篇文章只是对As3.0的一个简单应用介绍，只要告诉大家如何创建简单的类，如何使用改良的侦听事件模型，如何使用document class. 

Ps by egoldy:学完这篇文章，你会发现自已也可以编写在fla中看不见一行代码的程式了，真正的是界面与代码分离，控制，看上去真的是很酷，如果你也在学习As3.0，别忘了把你的心得分享一下。Cheers J.