Flash AS 教程:交互动画

交互动画
最后介绍一下交互动画，这也许是大家读这本书的主要原因。如果不使用交互运动，那么只使用补间动画不就行了。在前面一章简单地提到过，用户交互动画基于用户事件，总的来说可以归结为鼠标事件和键盘事件，下面就来学习不同的用户事件及其处理函数。
鼠标事件
as 3 中鼠标事件发生了显著的变化。在 as 2 中，影片剪辑会自动添加鼠标侦听器。现在，要手动地为对象添加侦听器。在 as 3 中鼠标指针经过显示对象时才能触发鼠标事件。在 as 2 中，无论鼠标指针在哪里，只要执行 mousedown 或 mousemove 就会触发所有的影片剪辑。而现在， mouseup 和 mousedown 事件与 as 2 中的 onpress 和 onrelase 等同。鼠标事件的名称是定义好的字符串，像我们之前所提到的，最好使用 mouseevent 类的属性，以避免输入错误，下面是 mouseevent 类中所有可用的鼠标事件属性：
click
double_click
mouse_down
mouse_move
mouse_out
mouse_over
mouse_up
mouse_wheel
roll_out
roll_over
创建下面这个类，来测试一下，这个类会输出发生在 sprite 影片上的鼠标事件名称。
package {
import flash.display.sprite;
import flash.events.mouseevent;
public class mouseevents extends sprite {
public function mouseevents() {
init();
}
private function init():void {
var sprite:sprite = new sprite();
addchild(sprite);
sprite.graphics.beginfill(0xff0000);
sprite.graphics.drawcircle(0, 0, 50);
sprite.graphics.endfill();
sprite.x = stage.stagewidth / 2;
sprite.y = stage.stageheight / 2;
sprite.addeventlistener(mouseevent.click, onmouseevent);
sprite.addeventlistener(mouseevent.double_click,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_down,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_move,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_out,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_over,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_up,onmouseevent);
sprite.addeventlistener(mouseevent.mouse_wheel,onmouseevent);
sprite.addeventlistener(mouseevent.roll_out,onmouseevent);
sprite.addeventlistener(mouseevent.roll_over,onmouseevent);
}
public function onmouseevent(event:mouseevent):void {
trace(event.type);
}
}
}
请注意，每个事件类型都使用了同一个处理函数，输出所触发的事件类型的名称。
鼠标位置
除了鼠标事件外，对于文档类还有两个非常重要属性用于表示鼠标当前的位置：mousex 和 mousey。请注意，影片剪辑的位置，返回的值是鼠标的位置与影片剪辑的注册点的相对位置。例如，有一个名为 sprite 的 sprite 影片，在舞台的 100,100 位置，而鼠标的位置在 150,250，你会得到如下结果：
mousex 为 150
mousey 为 250
sprite.mousex 为 50
sprite.mousey 为 150
请注意鼠标位置与影片位置的相对关系。
键盘事件
键盘事件已被 as 3 划分到另一个区域中。例如，在 as 2 中，影片剪辑会自动侦听键盘事件，但只在某种情况下才接收这些事件。所以，最好增加一个专门用来做侦听器的影片剪辑，有时，影片剪辑接收了多个事件但被看作是一个键盘事件，这样就不对了。在 as 2 的组成框架中，很大部一部分都是为键盘交互服务的，比如 flash player 体系中的：tab(table)管理，焦点(focus)管理及在文本框中对于 enter 键与 table 键的处理等。现在好了，键盘事件的名称与鼠标事件的相似，都是定义好的字符串，也可为 keyboardevent 类的属性。只有两种：
key_down
key_up
我们可以在一个特殊的对象上侦听键盘事件，就像上面那个鼠标侦听的例子一样。为了实现这个功能，我们需要设置对象的焦点，以便能够捕获这些事件，可以这样写：
stage.focus = sprite;
在很多情况下，侦听键盘事件是否有焦点很有意义，实现它只需直接对舞台进行键盘侦听。下面看一个示例：
package {
import flash.display.sprite;
import flash.events.keyboardevent;
public class keyboardevents extends sprite {
public function keyboardevents() {
init();
}
private function init():void {
stage.addeventlistener(keyboardevent.key_down,onkeyboardevent);
stage.addeventlistener(keyboardevent.key_up,onkeyboardevent);
}
public function onkeyboardevent(event:keyboardevent):void {
trace(event.type);
}
}
}
键码
通常人们并不关心一个键是否被按下，而是关心按下的是什么键。使用键盘事件处理有几种方法可以读取输入的信息。前面说到，一个事件处理程序可以由一个事件对象来触发，该对象包括触发这个事件的数据。在键盘事件中有两个相关的属性，事件所涉及的键：字符码(charcode)和键码(keycode)。
字符码指按下的键所表示的真正字符。例如，用户按下”a”键，字符码就是”a”，如果用户同时又按着 shift 键，这样字符码就是”a”。
键码指按键所代表的数值。如果用户按下”a”键，它所对应的键码为 65，无论是否按着其它键。如果先按下shift键后按下“a”键，那么会获得两个键盘事件，先是shift(键码 16)后是 a(键码 65)。 flash.ui.keyboard 类同样也有一些属性是针对非字母键的，我们不需要把它们背下来。例如： keyboard.shift 等于16，当 shift 键按下后，可以测试其是否等于 keyboard.shift。请本章的最后一段代码：
package {
import flash.display.sprite;
import flash.events.keyboardevent;
import flash.ui.keyboard;
public class keycodes extends sprite {
private var ball:sprite;
public function keycodes() {
init();
}
private function init():void {
ball = new sprite();
addchild(ball);
ball.graphics.beginfill(0xff0000);
ball.graphics.drawcircle(0, 0, 40);
ball.graphics.endfill();
ball.x = stage.stagewidth / 2;
ball.y = stage.stageheight / 2;
stage.addeventlistener(keyboardevent.key_down,onkeyboardevent);
}
public function onkeyboardevent(event:keyboardevent):void {
switch (event.keycode) {
case keyboard.up :
ball.y -= 10;
break;
case keyboard.down :
ball.y = 10;
break;
case keyboard.left :
ball.x -= 10;
break;
case keyboard.right :
ball.x = 10;
break;
default :
break;
}
}
}
}
当我们在 flash 编辑环境下测试影片时，ide会拦截用于控制 ide 自身的键。tab 键和所有功能键以及作为快捷菜单项的键，在测试影片时不会接收到。不过，我们可以在菜单中选择“控制” -> “禁用快捷键”，来解除限制。这样一来，测试的影片就像在浏览器中工作一样了。