首先 say hello 一下,在输出面板 trace 出 “Hello World!”。复习一下AS2的类代码:
class net.eidiot.learnAS3.HelloAs2{ public function HelloAs2(){ trace("Hello World!"); } }
为了让这段代码工作,需要在Flash IDE里场景的第一帧输入代码:
import net.eidiot.learnAS3.HelloAs2; var hello:HelloAs2 = new HelloAs2();
再来看看AS3的类:
package net.eidiot.learnAS3 { import flash.display.Sprite; public class HelloAs3 extends Sprite { public function HelloAs3(){ trace("Hello World!"); } } }
打开Flash 9,在文档属性的“Document class”里输入包名和类名,如图:
下面来看看区别。在AS3的类里多了一个package关键字,后面跟上类的包名(如果fla和类放在相同的文件夹就可以什么都不跟)。这样在声明类的时候就不用带上包名了。
public class HelloAs3 extends Sprite
class 关键字的前面多了一个 public 。在AS3里类还可以是 internal 。如果声明类为 internal 则只有同一个包里的其他类可以引用导入,包外的任何类都将访问不到它。此类继承了 Sprite 。AS3的类如果想使用 MC 的事件或方法必须让它继承 MovieClip 或者 Sprite 。Sprite 可以理解为没有时间轴的 MovieClip 。
最后一步是把它设置为 fla 的 Document class ,这样类 HelloAs3 就和文档 helloAs3.fla 绑定在一起了。关于 Document class 可以参考黑羽的文章: Document Class特色为我们带来了什么 。
是不是感觉AS3太麻烦了?高射炮打蚊子,是要费劲一点的。
//
尝试用AS3做一个简单的计数器。先来看看最后的效果:
实例效果(查看类代码)
public function ShowTimer(){ stage.scaleMode = StageScaleMode.NO_SCALE; stage.align = StageAlign.TOP_LEFT; initMc(); }
AS3里新加了很多的常量来代替字符串。这给我们带来了很大的方便。比如要限制影片的缩放模式为固定尺寸,AS2时的代码为
Stage.scaleMode = "noScale";
值是一个字符串,在输入的时候是没有代码提示的,很容易输错(我经常是到帮助文档里把字符串复制过来)。而在AS3里的代码为:
stage.scaleMode = StageScaleMode.NO_SCALE;
原来的字符串 “noScale” 由常量 StageScaleMode.NO_SCALE 代替。这样可以使用代码提示自动完成,有效避免了因为输错而造成的程序bug(而且很方便 )。同样的字符串常量还有一些事件类型比如 MouseEvent.CLICK 代替”click” 等等。
private function initMc():void{ showTxt = new TextField(); addShow(showTxt,10,10,310,20); addLabel(setDelayLabel,10,40,"delay:"); //...other code }
添加文本框和按钮。注意,需要再次引用的文本框必须显式初始化,否则在其他地方引用此变量将返回 null 。
private function addLabel(txt:TextField,x:uint,y:uint,text:String):void{ txt = new TextField(); txt.x = x; txt.y = y; txt.text = text; addChild(txt); }
AS3里所有的东西都是 new 出来的。仅仅 new 出来还不行,必须使用 addChild() 把它添加到显示列表里。
private function addBtn(mc:Sprite,...,clickHanlder:Function):void{ mc.mouseChildren = false; mc.graphics.beginFill(0x000000,0.3); mc.graphics.drawRect(0,0,w,h); mc.buttonMode = true; mc.addEventListener(MouseEvent.CLICK,clickHanlder); addChild(mc); // txt = new TextField(); txt.name = "btnText"; mc.addChild(txt); }
在AS3里想要 mc 成为一个按钮必须设置:
mc.buttonMode = true;
这时看到鼠标经过mc时并没有变成手形,原因在最后一行,把 txt 添加到了 mc 里用来显示按钮文字,以致鼠标事件的目标对象为txt而不是期望的mc。为了解决这个问题需要加上一句:
mc.mouseChildren = false;
以保证mc为鼠标事件的目标对象(target objects)。
AS3里所有的可见对象都是DisplayObject的子类,而DisplayObject是EventDispatcher的子类
Sprite → DisplayObjectContainer → InteractiveObject → DisplayObject → EventDispatcher → Object
也就是说所有的可见对象都可以直接addEventListener。
mc.addEventListener(MouseEvent.CLICK,clickHanlder);
这里用常量 MouseEvent.CLICK 代替了事件类型 “click” 。此类常量以后不再赘述。
mc.graphics.beginFill(0x000000,0.3); mc.graphics.drawRect(0,0,w,h);
AS3里所有的绘图方法都放在了 Graphics 里。Sprite的graphics属性就是一个Graphics。除了基本的 beginFill ,beginBitmapFill 之类,又增加了新的 drawCircle 、drawEllipse、drawRect 等方法,再也不用没完没了地 moveTo 、lineTo 了。
public function startTimer(event:MouseEvent):void{ //...code here }
下面是主要的内容了:Timer。
var delay:uint = setDelayTxt.text; var repeatCount:uint = setRepeatCountTxt.text; if(timer == null){ timer = new Timer(delay,repeatCount); }
uint是AS3新加的数据类型,表示32位的正整数(int 表示32位有符号的整数)。Timer的构造函数接受两个参数,delay 是 “timer” 事件延迟的毫秒数,repeatCount 是循环的次数,默认为0,即一直循环下去直到 stop 或者 reset 。
timer.addEventListener(TimerEvent.TIMER,timerHandler); timer.addEventListener(TimerEvent.TIMER_COMPLETE,timerCompleteHandler);
timer广播两个事件,每隔 delay 指定的毫秒广播一次 “timer” 事件,循环repeatCount次之后广播 “timerComplete” 事件。
timer.start(); startBtn.getChildByName("btnText").text = " stop ";
timer 在 start 之后开始执行,此时 running 属性为 true 。把 startBtn 设置为 “stop”,注意AS3是拿不到startBtn的child的,因为 Sprite 不是动态类,无法声明它的child。这时候想要拿到startBtn内的文本框就要使用 getChildByName 方法。当然要先给child一个name:
//function addBtn txt.name = "btnText";
最后是 stop 和 reset 的区别:reset 在 stop 之后把 currentCount 属性设为 0 。可以通过 最后编译的swf 体会一下。
//
做东西的时候发现AS3的EventDispatcher类好像不能传参数。请教 bogey ,答曰,写一个类继承 Event ,把参数放在构造里。试了一下,果然好用。
实例演示(查看类代码)
页面生成部分就不介绍了,唯一值得注意的是 TextField 类增加了一个 appendText 方法。以前的
myTxt.text += "your text";
应该写成:
myTxt.appendText("your text");
如果使用老的方法编译器会提示:这招太慢了,试试新的吧。(Appending text to a TextField using += is many times slower than using the TextField.appendText() method.) EventDispatcher 类的 dispatchEvent 方法只接受一个参数:event:Event。为了在广播事件的同时传递参数,写一个继承Event的类:TestEvent
internal class TestEvent extends Event{ //code here }
将事件类型声明为一个字符串常量:
public static const TRACE_INOF:String = "traceInfo";
将要传递的参数和事件类型一起放在构造函数里
private var _who:String; private var _info:String; public function TestEvent(type:String,who:String,info:String){ super(type);//调用父类 Event 的构造函数 _who = who; _info = info; }
广播事件的代码:
public function dispatch(who:String,info:String):void{ dispatchEvent(new TestEvent(TestEvent.TRACE_INOF,who,info)); }
注册监听器:
dispatcher.addEventListener(TestEvent.TRACE_INOF,onTraceInfo);
接收事件和参数:
public function onTraceInfo(event:TestEvent):void{ var traceTxt:TextField = getChildByName("traceTxt") as TextField; traceTxt.appendText(event.who+"dispatch:"+event.info); }
这里需要注意的是 as ,新的类型转换操作符,将 getChildByName() 返回的 DisplayObject 转换为前面声明的类型 TextField 。如果转换失败将返回 null 。官方给的例子:
public var myArray:Array = ["one", "two", "three"]; trace(myArray as Array); // one,two,three trace(myArray as Number); // null trace(myArray as int); // null
//
首先,AS3里function的参数可以有默认值了。
public function TestFunc(){ myFunc(); } private function myFunc(para1:int=10,para2:String="str"):void{ trace(para1 + " , " + para2); //10 , str }
AS3里不能给出多余的参数,
public function TestFunc(){ myFunc(2,"3",4); } private function myFunc(para1:int,para2:String):void{ trace(para1 + " , " + para2); }
编译器给出参数不匹配的错误:ArgumentError: Error #1063: Argument count mismatch on TestFunc/TestFunc::myFunc(). Expected 2, got 3.
这样以前那种用 arguments 拿到不固定参数的方法就不能用了。AS3给出一个新的关键字:… (rest) parameter
public function TestFunc(){ myFunc(2,"3",4,"5",true); } private function myFunc(para1:int,para2:String,... more):void{ trace(para1 + " , " + para2); //2 , 3 trace(more); //4,5,true }
在固定的参数后面跟一个 “…” 和一个表达式(如例子中的“more”),“…” 后面所有的参数将被放到以该表达式命名的数组中。注意 “…” 必须是最后一个参数。
如果使用 “…” arguments 就不可用了,自然也就拿不到 arguments.callee(对当前正在执行的函数的引用),所以在确定不使用 callee 的情况下才能用 “…”。
提到 arguments ,arguments.caller 已经被 “remove” 了。要想拿到 caller 需要把调用函数的 callee 作为参数传给被调用函数。官方的例子:
package { import flash.display.Sprite; public class ArgumentsExample extends Sprite { private var count:int = 1; public function ArgumentsExample() { firstFunction(true); } public function firstFunction(callSecond:Boolean) { trace(count + ": firstFunction"); if(callSecond) { secondFunction(arguments.callee); } else { trace("CALLS STOPPED"); } } public function secondFunction(caller:Function) { trace(count + ": secondFunction/n"); count++; caller(false); } } }
//
AS3有了按钮类:SimpleButton ,可以为四种状态分别指定不同的 DisplayObject 。但是 SimpleButton 没有继承 DisplayObjectContainer 类,也就是不能给它添加其他的 child 。如果要创建一个带文字的 Button 怎么办?两种方案:
代码 和 演示
创建一个按钮很简单,为它的四种状态分别指定一个 DisplayObject 就可以了:
btn = new SimpleButton(); btn.name = "btn"; btn.downState = new BtnStatusShape2(downColor,w,h); btn.overState = new BtnStatusShape2(overColor,w,h); btn.upState = new BtnStatusShape2(upColor,w,h); btn.hitTestState = btn.upState; addChild(btn);
注意必须指定 hitTestState ,就是Flash IDE里创建 Button 时的 hit 帧,响应鼠标事件的区域,如果没有它按钮就失去作用了。一般设置它和 upState 一样就可以了。
第二种方案的每种 state 都是一个 Shape(→ DisplayObject → EventDispatcher → Object):
internal class BtnStatusShape2 extends Shape{ public function BtnStatusShape2(bgColor:uint,w:uint,h:uint) { graphics.lineStyle(1,0x000000,0.8) graphics.beginFill(bgColor,0.8); graphics.drawRoundRect(0,0,w,h,8); graphics.endFill(); } }
方案一没有什么好说的。方案二如果想让 btn 响应鼠标事件可以重写装载它的 Sprite 的 addEventListener 方法:
public override function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void{ btn.addEventListener(type,listener); }
要重写继承自父类的方法必须使用 override 关键字。而且重写的方法必须有父类方法完全相同的参数名称、数量和类型。
当然方案二也可以通过监听 MOUSE_OVER、MOUSE_OUT、CLICK 等 MouseEvent 来改变不同状态的文本显示。其他内容参考类代码 。
//
AS3支持 label 了,跳出多层循环可以这样写:
outerLoop: for (var i:int = 0; i < 10; i++) { for (var j:int = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) break outerLoop; trace(10 * i + j); } }
AS2 的时候只能多加个变量判断:
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
package { import flash.display.Sprite; public class ArgumentsExample extends Sprite { private var count:int = 1; public function ArgumentsExample() { firstFunction(true); } public function firstFunction(callSecond:Boolean) { trace(count + ": firstFunction"); if(callSecond) { secondFunction(arguments.callee); } else { trace("CALLS STOPPED"); } } public function secondFunction(caller:Function) { trace(count + ": secondFunction/n"); count++; caller(false); } } }
//
AS3有了按钮类:SimpleButton ,可以为四种状态分别指定不同的 DisplayObject 。但是 SimpleButton 没有继承 DisplayObjectContainer 类,也就是不能给它添加其他的 child 。如果要创建一个带文字的 Button 怎么办?两种方案:
代码 和 演示
创建一个按钮很简单,为它的四种状态分别指定一个 DisplayObject 就可以了:
btn = new SimpleButton(); btn.name = "btn"; btn.downState = new BtnStatusShape2(downColor,w,h); btn.overState = new BtnStatusShape2(overColor,w,h); btn.upState = new BtnStatusShape2(upColor,w,h); btn.hitTestState = btn.upState; addChild(btn);
注意必须指定 hitTestState ,就是Flash IDE里创建 Button 时的 hit 帧,响应鼠标事件的区域,如果没有它按钮就失去作用了。一般设置它和 upState 一样就可以了。
第二种方案的每种 state 都是一个 Shape(→ DisplayObject → EventDispatcher → Object):
internal class BtnStatusShape2 extends Shape{ public function BtnStatusShape2(bgColor:uint,w:uint,h:uint) { graphics.lineStyle(1,0x000000,0.8) graphics.beginFill(bgColor,0.8); graphics.drawRoundRect(0,0,w,h,8); graphics.endFill(); } }
方案一没有什么好说的。方案二如果想让 btn 响应鼠标事件可以重写装载它的 Sprite 的 addEventListener 方法:
public override function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void{ btn.addEventListener(type,listener); }
要重写继承自父类的方法必须使用 override 关键字。而且重写的方法必须有父类方法完全相同的参数名称、数量和类型。
当然方案二也可以通过监听 MOUSE_OVER、MOUSE_OUT、CLICK 等 MouseEvent 来改变不同状态的文本显示。其他内容参考类代码 。
//
AS3支持 label 了,跳出多层循环可以这样写:
outerLoop: for (var i:int = 0; i < 10; i++) { for (var j:int = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) break outerLoop; trace(10 * i + j); } }
AS2 的时候只能多加个变量判断:
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
public var myArray:Array = ["one", "two", "three"]; trace(myArray as Array); // one,two,three trace(myArray as Number); // null trace(myArray as int); // null
//
首先,AS3里function的参数可以有默认值了。
public function TestFunc(){ myFunc(); } private function myFunc(para1:int=10,para2:String="str"):void{ trace(para1 + " , " + para2); //10 , str }
AS3里不能给出多余的参数,
public function TestFunc(){ myFunc(2,"3",4); } private function myFunc(para1:int,para2:String):void{ trace(para1 + " , " + para2); }
编译器给出参数不匹配的错误:ArgumentError: Error #1063: Argument count mismatch on TestFunc/TestFunc::myFunc(). Expected 2, got 3.
这样以前那种用 arguments 拿到不固定参数的方法就不能用了。AS3给出一个新的关键字:… (rest) parameter
public function TestFunc(){ myFunc(2,"3",4,"5",true); } private function myFunc(para1:int,para2:String,... more):void{ trace(para1 + " , " + para2); //2 , 3 trace(more); //4,5,true }
在固定的参数后面跟一个 “…” 和一个表达式(如例子中的“more”),“…” 后面所有的参数将被放到以该表达式命名的数组中。注意 “…” 必须是最后一个参数。
如果使用 “…” arguments 就不可用了,自然也就拿不到 arguments.callee(对当前正在执行的函数的引用),所以在确定不使用 callee 的情况下才能用 “…”。
提到 arguments ,arguments.caller 已经被 “remove” 了。要想拿到 caller 需要把调用函数的 callee 作为参数传给被调用函数。官方的例子:
package { import flash.display.Sprite; public class ArgumentsExample extends Sprite { private var count:int = 1; public function ArgumentsExample() { firstFunction(true); } public function firstFunction(callSecond:Boolean) { trace(count + ": firstFunction"); if(callSecond) { secondFunction(arguments.callee); } else { trace("CALLS STOPPED"); } } public function secondFunction(caller:Function) { trace(count + ": secondFunction/n"); count++; caller(false); } } }
//
AS3有了按钮类:SimpleButton ,可以为四种状态分别指定不同的 DisplayObject 。但是 SimpleButton 没有继承 DisplayObjectContainer 类,也就是不能给它添加其他的 child 。如果要创建一个带文字的 Button 怎么办?两种方案:
代码 和 演示
创建一个按钮很简单,为它的四种状态分别指定一个 DisplayObject 就可以了:
btn = new SimpleButton(); btn.name = "btn"; btn.downState = new BtnStatusShape2(downColor,w,h); btn.overState = new BtnStatusShape2(overColor,w,h); btn.upState = new BtnStatusShape2(upColor,w,h); btn.hitTestState = btn.upState; addChild(btn);
注意必须指定 hitTestState ,就是Flash IDE里创建 Button 时的 hit 帧,响应鼠标事件的区域,如果没有它按钮就失去作用了。一般设置它和 upState 一样就可以了。
第二种方案的每种 state 都是一个 Shape(→ DisplayObject → EventDispatcher → Object):
internal class BtnStatusShape2 extends Shape{ public function BtnStatusShape2(bgColor:uint,w:uint,h:uint) { graphics.lineStyle(1,0x000000,0.8) graphics.beginFill(bgColor,0.8); graphics.drawRoundRect(0,0,w,h,8); graphics.endFill(); } }
方案一没有什么好说的。方案二如果想让 btn 响应鼠标事件可以重写装载它的 Sprite 的 addEventListener 方法:
public override function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void{ btn.addEventListener(type,listener); }
要重写继承自父类的方法必须使用 override 关键字。而且重写的方法必须有父类方法完全相同的参数名称、数量和类型。
当然方案二也可以通过监听 MOUSE_OVER、MOUSE_OUT、CLICK 等 MouseEvent 来改变不同状态的文本显示。其他内容参考类代码 。
//
AS3支持 label 了,跳出多层循环可以这样写:
outerLoop: for (var i:int = 0; i < 10; i++) { for (var j:int = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) break outerLoop; trace(10 * i + j); } }
AS2 的时候只能多加个变量判断:
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
package { import flash.display.Sprite; public class ArgumentsExample extends Sprite { private var count:int = 1; public function ArgumentsExample() { firstFunction(true); } public function firstFunction(callSecond:Boolean) { trace(count + ": firstFunction"); if(callSecond) { secondFunction(arguments.callee); } else { trace("CALLS STOPPED"); } } public function secondFunction(caller:Function) { trace(count + ": secondFunction/n"); count++; caller(false); } } }
//
AS3有了按钮类:SimpleButton ,可以为四种状态分别指定不同的 DisplayObject 。但是 SimpleButton 没有继承 DisplayObjectContainer 类,也就是不能给它添加其他的 child 。如果要创建一个带文字的 Button 怎么办?两种方案:
代码 和 演示
创建一个按钮很简单,为它的四种状态分别指定一个 DisplayObject 就可以了:
btn = new SimpleButton(); btn.name = "btn"; btn.downState = new BtnStatusShape2(downColor,w,h); btn.overState = new BtnStatusShape2(overColor,w,h); btn.upState = new BtnStatusShape2(upColor,w,h); btn.hitTestState = btn.upState; addChild(btn);
注意必须指定 hitTestState ,就是Flash IDE里创建 Button 时的 hit 帧,响应鼠标事件的区域,如果没有它按钮就失去作用了。一般设置它和 upState 一样就可以了。
第二种方案的每种 state 都是一个 Shape(→ DisplayObject → EventDispatcher → Object):
internal class BtnStatusShape2 extends Shape{ public function BtnStatusShape2(bgColor:uint,w:uint,h:uint) { graphics.lineStyle(1,0x000000,0.8) graphics.beginFill(bgColor,0.8); graphics.drawRoundRect(0,0,w,h,8); graphics.endFill(); } }
方案一没有什么好说的。方案二如果想让 btn 响应鼠标事件可以重写装载它的 Sprite 的 addEventListener 方法:
public override function addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void{ btn.addEventListener(type,listener); }
要重写继承自父类的方法必须使用 override 关键字。而且重写的方法必须有父类方法完全相同的参数名称、数量和类型。
当然方案二也可以通过监听 MOUSE_OVER、MOUSE_OUT、CLICK 等 MouseEvent 来改变不同状态的文本显示。其他内容参考类代码 。
//
AS3支持 label 了,跳出多层循环可以这样写:
outerLoop: for (var i:int = 0; i < 10; i++) { for (var j:int = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) break outerLoop; trace(10 * i + j); } }
AS2 的时候只能多加个变量判断:
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }
var needBreak:Boolean = false; for (var i:Number = 0; i < 10; i++) { for (var j:Number = 0; j < 10; j++) { if ( (i == 8) && (j == 0)) { needBreak = true; break; } if(needBreak) break; trace(10 * i + j); } }