但是我们可以去看看其它的编程语言的文档，比如 VB，VC++，Java。它们都支持对文件的操作。因

此，我们的策略就是让 Flash 去调用一个执行写文件操作的应用程序来实现我们的计划。

这里有两个知识点：
1. fscommand("exec", "Write_File.exe") 这句话的意思就是让 Flash 去调用一个名为

Write_File.exe 的应用程序，这里有两点要非常注意：第一，被调用的程序必须在fscommand子文件

夹中，并且调用时不能传递参数；第二，Flash 影片必需发布为一个 .exe 的可执行文件，即让一个

可执行文件调用另一个可执行文件。

2. System.setClipboard(string:String) 调用这句话时，可以根据给定的 String 参数来设置剪贴

板。

下面就开始制作吧，今天我们的 ActionScript 尤其简单哟！
步骤1：在舞台中放入一个输入文本框：实例名"input_txt"；一个按钮：实例名"Submit_btn"；

步骤2：在第一帧中加入 ActionScript；
// 提示用户在此输入要写入的信息
input_txt.text = "在此写入一些内容，点击按钮后提交！";

// 点击按钮后执行 onClick 函数
Submit_btn.addEventListener(MouseEvent.CLICK, onClick);
function onClick(evt:MouseEvent):void {
 // 将文本内容写入到剪贴板(Clipboard)中
 System.setClipboard(String(input_txt.text));
 // 执行用于写文件的应用程序（这里不用写 fscommand 路径名，程序默认到这里取）
 fscommand("exec", "Write_File.exe");
}

步骤3：在菜单中选择“文件”->“发布设置”，勾选"Windows 放映文件（.exe）"，点击"发布"；

步骤4：在当前目录下，创建命为 fscommand 的子目录（必需）；

步骤5：万事具备，只欠东风！只要在 fscommand 子目录下再加入 Write_File.exe 就搞定了。您

可以使用任何喜欢的语言去编写，如 VB, VC 甚至可以是 Java（用包装软件将 jar 包装成 exe，但

不推荐这样使用，因为可能需要客户端去下载 jvm）。这里我使用 VC++ 制作一个 MFC 来生成

Write_File.exe。整体思想很简单：读取剪贴板内容，创建文件，将读入的字符串写入文件。最终会

在应用程序的同一目录下生成Save_Text.txt 文件，其内容就是我们在 Flash 的文本框中输入的。

以下是 VC++ 代码摘要：

// 导入 fstream 库文件
#include "fstream.h"

// TODO: Add extra initialization here
// 在窗口的初始化中加入
//***************************************************************************
 // 获得存储路径
 CString strPath;
 GetCurrentDirectory(MAX_PATH,strPath.GetBuffer(MAX_PATH));
 strPath.ReleaseBuffer();
 CString fullPath = strPath + '\\' + "Save_Text.txt";

 // 读取剪贴板
 char * buffer = NULL;
 CString fromClipboard;
 if (OpenClipboard()) {
    HANDLE hData = GetClipboardData(CF_TEXT);
    char * buffer = (char*)GlobalLock(hData);
    fromClipboard = buffer;
    GlobalUnlock(hData);
    CloseClipboard();
 }

 // 写文件
 ofstream outfile;
 outfile.open(fullPath);
 if (outfile.is_open()) {
    outfile << fromClipboard << endl;
    outfile.close();
 }
//**************************************************************************

步骤6：如果您不想使用其它语言编写也没关系，您可以直接使用下面我已经写好的这个 exe 文件（其中

附有 Flash 源文件）:

 http://www.fs2you.com/files/7bf1fb75-4fcb-11dd-aa18-0014221b798a/

结语：
    好了，完成！我们实际上就是在使用剪贴板作为中间媒介来传送消息，这也是一种进程间通

信的方式，因为所有进程都共享着同一个剪贴板。大家如果感兴趣可以把他制作成一个日记本的程序

—— 每次生成文件的文件名都以系统日期和时间命名。
    本次教程中，没有太多实质的内容，甚至我们的主角都不是 Flash，但是它可以给我们一些

启发。如果某些任务 Flash 无法完成，是否能让其它人来助我们一臂之力呢？一个好汉三个帮！

ActionScript 3.0 Cookbook (中文 pdf)
下载链接: http://www.fs2you.com/files/fdffee21-4cb1-11dd-b208-00142218fc6e/

ActionScript 3 及组件 官方指南 (中文 pdf)
下载链接: http://www.fs2you.com/files/08ecb991-4cb3-11dd-ac76-001143e7b41c/

XML 轻松学习手册 (中文 chm)
下载链接: http://www.fs2you.com/files/9d11d417-4cb3-11dd-8131-0014221f4662/

Essential ActionScript3.0 (英文 pdf)
下载链接: http://www.fs2you.com/files/000cb9a1-4cb4-11dd-ada0-00142218fc6e/

Foundation Flash CS3 for Designers (英文 pdf)
下载链接: http://www.fs2you.com/files/a6d38f63-4cb4-11dd-a92a-00142218fc6e/

AS3 Design Patterns (英文 pdf)
下载链接: http://www.fs2you.com/files/b3bae097-4cb2-11dd-8d04-001143e7b41c/

AS3 API (pdf)
下载链接: http://www.fs2you.com/files/e2c1ac6b-4cb4-11dd-99af-001143e7b41c/

ActionScript 3.0 Game Programming University (英文 pdf)
下载链接: http://www.fs2you.com/files/5bb37d7d-4cb5-11dd-ade3-00142218fc6e/

Flash AS 基理殿堂 2008年7月7日

http://blog.sina.com.cn/yyy98 

第三章
基础三角函数的计算：
角的正弦值 = 对边 / 斜边
角的余弦值 = 邻边 / 斜边
角的正切值 = 对边 / 邻边

弧度转换为角度以及角度转换为弧度：
弧度 = 角度 * Math.PI / 180
角度 = 弧度 * 180 / Math.PI

向鼠标（或者任何一个点）旋转：
// 用要旋转到的 x, y 坐标替换 mouseX, mouseY
dx = mouseX - sprite.x;
dy = mouseY - sprite.y;
sprite.rotation = Math.atan2(dy, dx) * 180 / Math.PI;

创建波形：
// 将 x, y 或其它属性赋值给 Sprite 影片或影片剪辑，
// 作为绘图坐标，等等。
public function onEnterFrame(event:Event){
 value = center + Math.sin(angle) * range;
 angle += speed;
}

创建圆形：
// 将 x, y 或其它属性赋值给 Sprite 影片或影片剪辑，
// 作为绘图坐标，等等。
public function onEnterFrame(event:Event){
 xposition = centerX + Math.cos(angle) * radius;
 yposition = centerY + Math.sin(angle) * radius;
 angle += speed;
}

创建椭圆：
// 将 x, y 或其它属性赋值给 Sprite 影片或影片剪辑，
// 作为绘图坐标，等等。
public function onEnterFrame(event:Event){
 xposition = centerX + Math.cos(angle) * radiusX;
 yposition = centerY + Math.sin(angle) * radiusY;
 angle += speed;
}

获得两点间的距离：
// x1, y1 和 x2, y2 是两个点
// 也可以是 Sprite / MovieClip 坐标，鼠标坐标，等等。
dx = x2 – x1;
dy = y2 – y1;
dist = Math.sqrt(dx*dx + dy*dy);

第四章

十六进制转换为十进制：
trace(hexValue);

十进制转换为十六进制：
trace(decimalValue.toString(16));

颜色组合：
color24 = red << 16 | green << 8 | blue;
color32 = alpha << 24 | red << 16 | green << 8 | blue;

颜色提取：
red = color24 >> 16;
green = color24 >> 8 & 0xFF;
blue = color24 & 0xFF;
alpha = color32 >> 24;
red = color32 >> 16 & 0xFF;
green = color32 >> 8 & 0xFF;
blue = color232 & 0xFF;

穿过某点绘制曲线：
// xt, yt 是我们想要穿过的一点
// x0, y0 以及 x2, y2 是曲线的两端
x1 = xt * 2 – (x0 + x2) / 2;
y1 = yt * 2 – (y0 + y2) / 2;
moveTo(x0, y0);
curveTo(x1, y1, x2, y2);

第五章
角速度转换为 x, y 速度：
vx = speed * Math.cos(angle);
vy = speed * Math.sin(angle);

角加速度（作用于物体上的 force）转换为 x, y 加速度：
ax = force * Math.cos(angle);
ay = force * Math.sin(angle);

将加速度加入速度：
vx += ax;
vy += ay;

将速度加入坐标：
movieclip._x += vx;
sprite.y += vy;

第六章
移除出界对象：
if(sprite.x - sprite.width / 2 > right ||
sprite.x + sprite.width / 2 < left ||
sprite.y – sprite.height / 2 > bottom ||
sprite.y + sprite.height / 2 < top)
{
 // 删除影片的代码
}

重置出界对象：
if(sprite.x - sprite.width / 2 > right ||
sprite.x + sprite.width / 2 < left ||
sprite.y – sprite.height / 2 > bottom ||
sprite.y + sprite.height / 2 < top)
{
 // 重置影片的位置和速度
}

屏幕环绕出界对象：
if(sprite.x - sprite.width / 2 > right)
{
 sprite.x = left - sprite.width / 2;
}
else if(sprite.x + sprite.width / 2 < left)
{
 sprite.x = right + sprite.width / 2;
}
if(sprite.y – sprite.height / 2 > bottom)
{
 sprite.y = top – sprite.height / 2;
}
else if(sprite.y + sprite.height / 2 < top)
{
 sprite.y = bottom + sprite.height / 2;
}

摩擦力应用（正确方法）：
speed = Math.sqrt(vx * vx + vy * vy);
angle = Math.atan2(vy, vx);
if(speed > friction)
{
 speed -= friction;
}
else
{
 speed = 0;
}
vx = Math.cos(angle) * speed;
vy = Math.sin(angle) * speed;

摩擦力应用（简便方法）：
vx *= friction;
vy *= friction;

第八章：
简单缓动运动，长形：
var dx:Number = targetX - sprite.x;
var dy:Number = targetY - sprite.y;
vx = dx * easing;
vy = dy * easing;
sprite.x += vx;
sprite.y += vy;

简单缓动运动，中形：
vx = (targetX - sprite.x) * easing;
vy = (targetY - sprite.y) * easing;
sprite.x += vx;
sprite.y += vy;

简单缓动运动，短形：
sprite.x += (targetX - sprite.x) * easing;
sprite.y += (targetY - sprite.y) * easing;

简单弹性运动，长形：
var ax:Number = (targetX - sprite.x) * spring;
var ay:Number = (targetY - sprite.y) * spring;
vx += ax;
vy += ay;
vx *= friction;
vy *= friction;
sprite.x += vx;
sprite.y += vy;

简单弹性运动，中形：
vx += (targetX - sprite.x) * spring;
vy += (targetY - sprite.y) * spring;
vx *= friction;
vy *= friction;
sprite.x += vx;
sprite.y += vy;

简单弹性运动，短形：
vx += (targetX - sprite.x) * spring;
vy += (targetY - sprite.y) * spring;
sprite.x += (vx *= friction);
sprite.y += (vy *= friction);

偏移弹性运动：
var dx:Number = sprite.x - fixedX;
var dy:Number = sprite.y - fixedY;
var angle:Number = Math.atan2(dy, dx);
var targetX:Number = fixedX + Math.cos(angle) * springLength;
var targetY:Number = fixedX + Math.sin(angle) * springLength;
// 如前例弹性运动到 targetX, targetY

第九章
距离碰撞检测：
// 从影片 spriteA 和 spriteB 开始
// 如果使用一个空白影片，或影片没有半径（radius）属性
// 可以用宽度或高度除以 2。
var dx:Number = spriteB.x - spriteA.x;
var dy:Number = spriteB.y - spriteA.y;
var dist:Number = Math.sqrt(dx * dx + dy * dy);
if(dist < spriteA.radius + spriteB.radius)
{
 // 处理碰撞
}

多物体碰撞检测：
var numObjects:uint = 10;
for(var i:uint = 0; i < numObjects - 1; i++)
{
 // 使用变量 i 提取引用
 var objectA = objects[i];
 for(var j:uint = i+1; j
 {
  // // 使用变量 j 提取引用
  var objectB = objects[j];
  // perform collision detection
  // between objectA and objectB
 }
}

第十章
坐标旋转：
x1 = Math.cos(angle) * x - Math.sin(angle) * y;
y1 = Math.cos(angle) * y + Math.sin(angle) * x;

反坐标旋转：
x1 = Math.cos(angle) * x + Math.sin(angle) * ;y
y1 = Math.cos(angle) * y - Math.sin(angle) * x;

第十一章
动量守恒的数学表达式：
                (m0 – m1) * v0 + 2 * m1 * v1
v0Final = ----------------------------------------------
                          m0 + m1
 
                (m1 – m0) * v1 + 2 * m0 * v0
v1Final = ---------------------------------------------
                          m0 + m1

动量守恒的 ActionScript 表达式，短形:
var vxTotal:Number = vx0 - vx1;
vx0 = ((ball0.mass - ball1.mass) * vx0 +
2 * ball1.mass * vx1) /
(ball0.mass + ball1.mass);
vx1 = vxTotal + vx0;

第十二章
引力的一般公式：
force = G * m1 * m2 / distance²

ActionScript 实现万有引力：
function gravitate(partA:Ball, partB:Ball):void
{
 var dx:Number = partB.x - partA.x;
 var dy:Number = partB.y - partA.y;
 var distSQ:Number = dx * dx + dy * dy;
 var dist:Number = Math.sqrt(distSQ);
 var force:Number = partA.mass * partB.mass / distSQ;
 var ax:Number = force * dx / dist;
 var ay:Number = force * dy / dist;
 partA.vx += ax / partA.mass;
 partA.vy += ay / partA.mass;
 partB.vx -= ax / partB.mass;
 partB.vy -= ay / partB.mass;
}

第十四章
余弦定理
a² = b² + c² - 2 * b * c * cos A
b² = a² + c² - 2 * a * c * cos B
c² = a² + b² - 2 * a * b * cos C

ActionScript 的余弦定理:
A = Math.acos((b * b + c * c - a * a) / (2 * b * c));
B = Math.acos((a * a + c * c - b * b) / (2 * a * c));
C = Math.acos((a * a + b * b - c * c) / (2 * a * b));

第十五章
基本透视法：
scale = fl / (fl + zpos);
sprite.scaleX = sprite.scaleY = scale;
sprite.alpha = scale; // 可选
sprite.x = vanishingPointX + xpos * scale;
sprite.y = vanishingPointY + ypos * scale;

Z 排序：
// 假设有一个带有 zpos 属性的 3D 物体的数组
objectArray.sortOn("zpos", Array.DESCENDING | Array.NUMERIC);
for(var i:uint = 0; i < numObjects; i++)
{
 setChildIndex(objectArray[i], i);
}

坐标旋转：
x1 = cos(angleZ) * xpos - sin(angleZ) * ypos;
y1 = cos(angleZ) * ypos + sin(angleZ) * xpos;
x1 = cos(angleY) * xpos - sin(angleY) * zpos;
z1 = cos(angleY) * zpos + sin(angleY) * xpos;
y1 = cos(angleX) * ypos - sin(angleX) * zpos;
z1 = cos(angleX) * zpos + sin(angleX) * ypos;

3D 距离：
dist = Math.sqrt(dx * dx + dy * dy + dz * dz);

基于计时器的动画
    作为计时器动画使用的关键类，不出意料，它就是 flash.utils.Timer。同时我们还需要 flash.events.TimerEvent 类。
    使用计时器实际上与使用 enterFrame 没什么两样。只需要我们去创建一个计时器(Timer)，告诉它多久“滴答响”一声，并侦听 TimerEvent.TIMER 事件，就像对 Event.ENTER_FRAME 事件的侦听一样。哦，还要告诉计时器何时开始！接下来，计时器就会每隔一段时间广播一个计时事件，它将调用赋给它的函数进行处理。计时器触发的间隔以毫秒为单位，在创建该计时器时指定。让我们来看一个简单的例子（可在 Timer1.as 中找到）：
package {
 import flash.display.Sprite;
 import flash.utils.Timer;
 import flash.events.TimerEvent;
 public class Timer1 extends Sprite {
  private var timer:Timer;
  public function Timer1() {
   init();
  }
  private function init():void {
   timer = new Timer(30);
   timer.addEventListener(TimerEvent.TIMER, onTimer);
   timer.start();
  }
  private function onTimer(timer:TimerEvent):void {
   trace("timer!");
  }
 }
}
重要的部分加粗表示。我们创建一个计时器，告诉它每隔 30 毫秒触发一次，意味着每秒约 33 次。添加一个事件的侦听器并将它起动。 onTimer 方法与我们以前用的 onEnterFrame 类似。
    这是我们所要知道计时器的大部分内容。它还有其它两个漂亮的特征。一个是在创建计时器时，可以通过第二个参数，repeatCount，告诉它运行的次数。假设我们要让计时器每秒运行一次，总共执行 5 秒。就可以这样做：
    timer = new Timer(1000, 5);
如果没有指定重复的次数，或传入 0，那么计时器将无限地运行。
    另一个好东西是可以让计时器在某个点上启动或停止，只需要调用 timer.stop 或 timer.start 即可。在某些例子中，这样做比删除和重新加入事件侦听器更简单一些。
    与 enterFrame 相比，很多朋友更喜欢使用计时器的原因是，理论上讲，计时器可以让我们控制动画的速度——这是对于帧的不精确性的一个重大改进。我之所以说“理论上讲”，是因为这里有些事情需要弄清楚。
    首先，实际上计时器要依赖于帧频。另一个原因是计时器的事件函数中的代码会增加整个计时器间隔。稍后我会解释一下第二点。现在，让我们看看计时器是如何与帧频相关联的。下面是文档类 Timer2.as，使用到我们著名的 Ball 类。
package {
 import flash.display.Sprite;
 import flash.utils.Timer;
 import flash.events.TimerEvent;
 public class Timer2 extends Sprite {
  private var timer:Timer;
  private var ball:Ball;
  public function Timer2() {
   init();
  }
  private function init():void {
   stage.frameRate = 1;
   ball = new Ball();
   ball.y = stage.stageHeight / 2;
   ball.vx = 5;
   addChild(ball);
   timer = new Timer(20);
   timer.addEventListener(TimerEvent.TIMER, onTimer);
   timer.start();
  }
  private function onTimer(event:TimerEvent):void {
   ball.x += ball.vx;
  }
 }
}
这里我们把创建出来的小球放在舞台的左侧。让它以 vx 为 5 的速度穿过舞台。然后设置一个 20 毫秒的计时器，每秒约调用 50 次。同时设置影片的帧频为 1 就是为了看看帧频是否会对计时器有影响。
    测试后，我们会看到小球没有平稳地穿过屏幕，而是每秒钟跳一下 —— 以帧的频率。每跳一次都会大于 5 像素。为什么呢？
    回想一下一、二章的动画基础，我们知道模型是需要更新的，所以屏幕要根据新的模型被刷新。这里时间间隔函数确实将更新了模型并将小球每次移动 5 像素，但是只有在 Flash 进入新的一帧时才进行刷新。仅仅运行一个函数不会驱使 Flash 进行重绘。
    幸运的是，Macromedia (现在的 Adobe) 的好人们看到了这个问题并给了我们另一个小工具：updateAfterEvent。最初是在 Flash MX 中介绍的，现在它是传给计时器事件函数中 TimerEvent 对象的一个方法。就像它的名字一样，在事件之后刷新屏幕的。当然，由于它是 TimerEvent 类的一个方法，所以只有在收到一个事件后才能被调用。（事实上，它也是 KeyboardEvent 和 MouseEvent 的方法，因此也能在这些处理函数中调用。）
这样一来，我们可以修正一下 onTimer 事件：
private function onTimer(event:TimerEvent):void {
 ball.x += ball.vx;
 event.updateAfterEvent();
}
现在一切有所好转了。非常流畅。但是如果您意识到小球应该每秒更新 50 次，我们看到的基本上应该是一个 50 fps 的动画。这就意味着小球的运动应该比第四章创建的 fps 小于 50 的 enterFrame 事件的例子更为流畅。但是实际的运动更为缓慢。
    问题出来了，计时器在某种程度上要依赖于帧频。通过我的测算，在帧频为 1 fps 时，我们所得到的计时器运行的最快间隔大约为 100 毫秒。
    我已经听到了嘲笑：每帧只得到了 10 次间隔。所以，试将帧频改为 5。它允许每秒更新 50 次。在我看来，仍然不是很流畅。如果不大于每秒 10 帧的话是不会达到真正流畅的效果。因此，我们可以看到使用计时器并不能完全让我们从帧频的铐链中解脱出来。
    下一个问题是计时器内部是怎样工作的，它会对计时的精确度产生多大的影响。当 timer.start() 被调时，实际上发生了什么，Flash 等待一段指定的时间，然后广播事件，运行与该计时器相关的处理函数。只有当函数执行完成后计时器才开始定时下一次计时。看一个例子，假设我们有一个每 20 毫秒运行一次计时器。假设在处理函数中有大量的代码需要执行 30 毫秒。下一轮定时只有在所有的代码都运行完成后才开始。这样一来，我们的函数会在大约每 50 毫秒调用一次。因为在用户的机器上没法精确地知道代码会运行多快，所以多数情况下，计时器动画不会比帧动画精确多少。
   如果您需要真正的精确，那么基于时间的动画则是我们的必经之路。

基于时间的动画
    如果要让动画中物体的速度是一致的，那么基于时间的动画就是我们要使用的方法。这种方法在一些游戏中比较常用。我们知道，帧和计时器动画都不能以特定的速率播放。一个复杂的动画在一台又老又慢的电脑上运行可能要比最初设计的速度慢上许多。我们马上会看到，使用基于时间的动画无论最终动画运行的帧频如何，都将获得可靠的速度。
    首先要改变考虑速度的方法。到目前为止，在我说 vx = 5 时，我们使用的单位是像素每帧（pixels per frame）。换句话讲，每进入新的一帧物体都将在 x 轴上运动 5 像素。在计时器动画中，当然，就应该是每次定时间隔移动 5 像素。
    对于时间动画，我们将使用真正的时间单位，如秒。由于我们是处理完整的一秒，而非其中的一部分，因此这个速度值就要更大一些。如果某个物体的速度是每帧 10 像素，每秒 30 帧的速度运动，大约每秒 300 像素。比如下面这个例子，我从第六章的 Bouncing2.as 文档类中截取了一部分并进行了一些变化，见下面粗体部分（也可在 TimeBased.as 中找到）：
package {
 import flash.display.Sprite;
 import flash.events.Event;
 import flash.utils.getTimer;
 public class TimeBased extends Sprite {
  private var ball:Ball;
  private var vx:Number;
  private var vy:Number;
  private var bounce:Number = -0.7;
  private var time:Number;
  public function TimeBased() {
   init();
  }
  private function init():void {
   stage.frameRate = 10;
   ball = new Ball();
   ball.x = stage.stageWidth / 2;
   ball.y = stage.stageHeight / 2;
   vx = 300;
   vy = -300;
   addChild(ball);
   time = getTimer();
   addEventListener(Event.ENTER_FRAME, onEnterFrame);
  }
  private function onEnterFrame(event:Event):void {
   var elapsed:Number = getTimer() - time;
   time = getTimer();
   ball.x += vx * elapsed / 1000;
   ball.y += vy * elapsed / 1000;
   var left:Number = 0;
   var right:Number = stage.stageWidth;
   var top:Number = 0;
   var bottom:Number = stage.stageHeight;
   if (ball.x + ball.radius > right) {
    ball.x = right - ball.radius;
    vx *= bounce;
   } else if (ball.x - ball.radius < left) {
    ball.x = left + ball.radius;
    vx *= bounce;
   }
   if (ball.y + ball.radius > bottom) {
    ball.y = bottom - ball.radius;
    vy *= bounce;
   } else if (ball.y - ball.radius < top) {
    ball.y = top + ball.radius;
    vy *= bounce;
   }
  }
 }
}
如上所描述，我改变了对速度的计算，让它们使用固定的值，而非随机值。然后我创建了一个名为 time 的变量，让它等于 flash.utils.getTimer 函数的结果。getTimer 函数非常简单。它返回影片已经运行了的毫秒数 —— 这就是它全部的工作。我们没有办法清除它，重启它，改变它，等等。它只是一个计数器。
    看起来它似乎用处不大，但是如果先调用一次 getTimer 将值保存起来，稍后再调用它一次，将两个结果相减，我们就能知道确切的—— 毫秒 ——这两次调用之间经过了多少时间。
    这就是策略：在每帧的开始时调用 getTimer 计算与上一帧间隔了多长时间。如果将它除以 1,000，我们将得到以秒为单位的间隔时间，这是个以秒为单位的分数。由于我们的 vx 和 vy 现在是以像素每秒来计算的，因此可以让它们去乘以这个分数，这样就知道要对物体移动多少了。同样，不要忘记重新设置 time 变量的值，以便让下一帧进行计算。
    测试一下，我们将看到小球移动的速度几乎与最初的速度相同！但是真正令人激动的是我们可以以任何帧频来发布这个影片，它仍然可以以同样的速度运动！通过修改 stage.frameRate 的值，试验一下高到 1,000 fps，低到 10 fps，你会看到小球的速度是相同的。当然，较高的频率会让动画更加流畅，而较低的频率则会十分不连贯，但是速度是一致的。
    大家可以把这个技术应用在本书任何一个包含速度的例子中。如果这样的话，还需要将相似的技术应用在加速度或外力上，如重力，因为它们也是基于时间的。加速度肯定要比转前要大很多，因为加速度被定义为速度对时间的变化率。例如，重力大约为 32 英尺／秒／秒。
    如果在一个 30 fps 帧的动画中，重力为 0.5 的话，那么现在就应该是 450。计算方法 0.5 * 30 * 30。然后像这样将它加入：
     vy += gravity * elapsed / 1000;
在最后一个例子中加入 450 重力后测试一下。我们会看到它与帧动画中加入重力 0.5 的效果是相同的。使用这种技术的一个技巧是将帧频设置得非常高，如 100。虽然没有机器能够与真正的帧频相吻合，但是基于时间的动画将保证每个人看到的影片运行得都是最流畅的。

同质量物体的碰撞
    回忆一下第十一章的动量守恒。那里有非常严谨的代码。不过，当两个相同质量的物体发生碰撞时，我们实现起来可以更简单一些。基本原理是，两个物体沿着碰撞的线路交换它们的速度。同时还要用坐标旋转来决定碰撞的线路，以及物体的速度，这样就摆脱了复杂的动量守恒公式。来看看它是如何工作的，让我们回到文件 MultiBilliard2.as 中，将用它作为下一个例子 SameMass.as 的基础。我就不再列出原先所有的代码了，因为它实在是一个很大的文件。但是，我们要来看一下创建所有小球的 for 循环：
for(var i:uint = 0; i < numBalls; i++) {
var radius:Number = Math.random() * 50 + 20;
 var ball:Ball = new Ball(radius);
 ball.mass = radius;
 ball.x = Math.random() * stage.stageWidth;
 ball.y = Math.random() * stage.stageHeight;
 ball.vx = Math.random() * 10 - 5;
 ball.vy = Math.random() * 10 - 5;
 addChild(ball);
 balls.push(ball);
}
对于新的文件来说，要把粗体字的部分改为这一行：
    var radius:Number = 30;
让所有小球大小都相同，消除了质量的概念，相当于给它们相同的质量。
接下来，看一下 checkCollision 函数。请找到这一部分：
// 旋转 ball0 的速度
var vel0:Point = rotate(ball0.vx,
ball0.vy,
sin,
cos,
true);
// 旋转 ball1 的速度
var vel1:Point = rotate(ball1.vx,
ball1.vy,
sin,
cos,
true);
// 碰撞反应
var vxTotal:Number = vel0.x - vel1.x;
vel0.x = ((ball0.mass - ball1.mass) * vel0.x +
2 * ball1.mass * vel1.x) /
(ball0.mass + ball1.mass);
vel1.x = vxTotal + vel0.x;
这一部分找出了碰撞线路上的速度，根据物体的质量求出碰撞的结果。“碰撞反应”部分是动量守恒的要素，这就是我们可以消除的部分。我们可以让 vel0 和 vel1 进行交换，就可以很容易地替换它了。整个代码段如下：
// 旋转 ball0 的速度
var vel0:Point = rotate(ball0.vx,
ball0.vy,
sin,
cos,
true);
// 旋转 ball1 的速度
var vel1:Point = rotate(ball1.vx,
ball1.vy,
sin,
cos,
true);
// 交换两个速度
var temp:Point = vel0;
vel0 = vel1;
vel1 = temp;
这里甚至还可以再优化，但是为了代码的清晰我就不做改变了。现在我们已经摆脱了一小块儿数学问题，测试一下修改前与修改后的文件，所得的结果是相同的。

声音整合
    本书一直没有提到声音的使用。因为声音并不是动画的直接组成部分，优质的声音效果可以让 Flash 影片更加真实、引人入胜。
    我们可以使用不同的方法来加入声音。回溯到 Flash IDE 最早的程序版本，我们有一种使用声音的特殊方式 —— 将声音导入到库，再把它加入到帧里面。这不是我要介绍的方法。我将介绍在 AS 3 中使用声音的一些基础。
    AS 3 的 Sound 类有了很大的变化，而且还有几个额外的类可以帮助我们对其进行修饰。这里没有太多的空间进行深入的讨论，但是有一个方面我想应该对于我们这本书来说会很有用。这就是当动画中发生某种事件时，应该播放声音。最明显的就应该是碰撞了。一个小球碰到墙上或其它小球上，我们会听到“砰”、“啵嘤”、“啪”或其它什么声音。因此，我们需要掌握通过 ActionScript 来启动声音的能力。
 这个例子中，我们还要回到 Bouncing2.as，小球会与墙壁产生碰撞。每次碰撞到墙壁时，我想让它发出声音。新的类请见 SoundEvents.as。
    首先，需要有声音效果。在网上有许多免费的声音效果资源。其中最火的 Flash 声音网站是 FlashKit。他们的音乐文件除了有 loop 以外，还有一个声音效果库 www.flashkit.com/soundfx/。这些效果被分类为 Cartoon，Interfaces，Mechanical 等等，而且这个网站有超过 6,000 多个声音效果文件，所以您应该能够找到适合自己的音效。我们可以在页面上直接进行预览（preview），找到自己喜欢的文件后，以 MP3 格式进行下载。将它保存到硬盘上与最终发部的影片放在同一目录下。
    有时我们要重新给文件一个更为简单的名字。例如，我下载了一个“boing”声音，我就将它重命名为 boing.mp3。
    在 AS 3 中使用声音的基础实际上要比 AS 2 中简单一些。
首先，我们需要创建声音对象。假设在类中已经声明了一个名为 boing 的变量：
    private var boing:Sound;
创建一个声音对象就这么简单：
    boing = new Sound();
当然，如同大多数 AS 3 的类一样，Sound 类也在包中，flash.media 包，因此要确保先导入 flash.media.Sound。

    连接一个外部声音对象最简单的方法是在构造函数中传入一个请求（request）。
    就像读取外部图像（第四章）一样，我们不能直接传入外部声音文件的 URL。而是要将它包装到 URLRequest 中（flash.net.URLRequest，需要导入它）。应该像这样：
    boing = new Sound(new URLRequest("boing.mp3"));
全部内容就是这样。现在声音已经准备好。我们要做的就是：
    mySound.play();
无论在哪儿都会播放出这个音效。在 play 中有一些可选参数，如偏移的毫秒数，以及播放的次数，但是默认情况下是从声音的起始位置播放一次声音，这已经满足了我们通常的需求。以下是 SoundEvents.as 的全部代码，展示了 Sound 对象的创建，无论何时小球碰撞到墙上，都会播放声音。
package {
 import flash.display.Sprite;
 import flash.events.Event;
 import flash.media.Sound;
 import flash.net.URLRequest;
 public class SoundEvents extends Sprite {
  private var ball:Ball;
  private var vx:Number;
  private var vy:Number;
  private var bounce:Number = -0.7;
  private var boing:Sound;
  public function SoundEvents() {
   init();
  }
  private function init():void {
   boing = new Sound(new URLRequest("boing.mp3"));
   ball = new Ball();
   ball.x = stage.stageWidth / 2;
   ball.y = stage.stageHeight / 2;
   vx = Math.random() * 10 - 5;
   vy = -10;
   addChild(ball);
   addEventListener(Event.ENTER_FRAME, onEnterFrame);
  }
  private function onEnterFrame(event:Event):void {
   ball.x += vx;
   ball.y += vy;
   var left:Number = 0;
   var right:Number = stage.stageWidth;
   var top:Number = 0;
   var bottom:Number = stage.stageHeight;
   if (ball.x + ball.radius > right) {
    boing.play();
    ball.x = right - ball.radius;
    vx *= bounce;
   } else if (ball.x - ball.radius < left) {
    boing.play();
    ball.x = left + ball.radius;
    vx *= bounce;
   }
   if (ball.y + ball.radius > bottom) {
    boing.play();
    ball.y = bottom - ball.radius;
    vy *= bounce;
   } else if (ball.y - ball.radius < top) {
    boing.play();
    ball.y = top + ball.radius;
    vy *= bounce;
   }
  }
 }
}
测试一下影片看一看 … … 听一听拥有声音以后带来的不同感受。当然，要找到正确的声音用在正确的环境下，也不要加得太多，因为这本身也是一门艺术。

布朗（随机）运动
    先讲讲历史。一天，一个名叫罗伯特-布朗（Robert Brown）的植物学家正在观察一滴水中的花粉颗粒，随后他发现这些花粉是在随机运动的。虽然它们不是水流或水的运动，但是这些小小的颗粒却永远不会停下来。他发现同样的事情会发生在微尘中，但它们不会像花粉那样游泳。虽然他不知道为什么会有这种现象，其实不只是他还有其他所有人在几十年内都不能给出解释，但是他却将这种现象用自己的名字命名 —— 只是为了能意识到它！
    当今，我们对布朗运动的解释是大量的水分子在一滴水中不断运动，虽然水滴看上去是静止的。这些水分子与花粉和灰尘发生碰撞，将一些动量传给它们。因为即使是一颗小小的灰尘都要比一个水分子重上一百万倍，所以一次碰撞不会带来多大的影响。但是当每秒有几百万次的碰撞时，那么这些动量就会累计起来。
    现在，一些水分子也许撞到了灰尘的一边，而另一些则撞在了另一边。最终，它们会达到总的平均值。但是，随着时间的变化，受到更多撞击的一边就会产生波动，假设为左边，那么这个粒子就会向右运动一点。底部所受撞击越多，则粒子向上运动得就越多。最后所有的值趋于平均，最终的结果通常不会在任何一个方向产生太多的动量。这就是随机悬浮动作。
    我们可以在 Flash 中轻松地模拟出这种效果。在每一帧中，计算一个随机数加在运动物体的 x 和 y 速度中。随机的数值应该即可以是正数也可以是负数，并且一般来说都非常小，比如范围从 -0.1 到 +0.1。形式如下：
    vx += Math.random() * 0.2 - 0.1;
    vy += Math.random() * 0.2 - 0.1;
用 0.2 乘以一个随机的小数，所得的值从 0.0 到 0.2。再减去 0.1 则值变为 -0.1 到 0.1。在这里加入一些摩擦力（friction）很重要，否则速度会增大，并产生不自然的加速。在 Brownian1.as 中，我创建了 50 个粒子并让它们以布朗运动的形式悬浮。粒子就是我们熟悉的 Ball 类的实例，让它们为黑色并缩小。以下是代码：
package {
 import flash.display.Sprite;
 import flash.events.Event;
 public class Brownian1 extends Sprite {
  private var numDots:uint = 50;
  private var friction:Number = 0.95;
  private var dots:Array;
  public function Brownian1() {
   init();
  }
  private function init():void {
   dots = new Array();
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    dot.x = Math.random() * stage.stageWidth;
    dot.y = Math.random() * stage.stageHeight;
    dot.vx = 0;
    dot.vy = 0;
    addChild(dot);
    dots.push(dot);
   }
   addEventListener(Event.ENTER_FRAME, onEnterFrame);
  }
  private function onEnterFrame(event:Event):void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = dots[i];
    dot.vx += Math.random() * 0.2 - 0.1;
    dot.vy += Math.random() * 0.2 - 0.1;
    dot.x += dot.vx;
    dot.y += dot.vy;
    dot.vx *= friction;
    dot.vy *= friction;
    if (dot.x > stage.stageWidth) {
     dot.x = 0;
    } else if (dot.x < 0) {
     dot.x = stage.stageWidth;
    }
    if (dot.y > stage.stageHeight) {
     dot.y = 0;
    } else if (dot.y < 0) {
     dot.y = stage.stageHeight;
    }
   }
  }
 }
}

这里大多部分内容都不是什么新知识，我已将有关的部分用加粗表示。
如图 19-1 所示，代码运行时屏幕上的显示。

图19-1 布朗运动
在 Brownian2.as 中，我将 numDots 减少到 20。然后将这行代码：
    graphics.lineStyle(0, 0, .5);
加入到 init 函数中，并在 onEnterFrame 中加入一些绘图的代码。
private function onEnterFrame(event:Event):void {
 for (var i:uint = 0; i < numDots; i++) {
  var dot:Ball = dots[i];
  graphics.moveTo(dot.x, dot.y);
  dot.vx += Math.random() * 0.2 - 0.1;
  dot.vy += Math.random() * 0.2 - 0.1;
  dot.x += dot.vx;
  dot.y += dot.vy;
  dot.vx *= friction;
  dot.vy *= friction;
  graphics.lineTo(dot.x, dot.y);
 }
}
这样就在每个 dot 移动前与移动后的位置之间绘制了一条线。也就绘制出了自己的运动路径，如图 19-2 所示。如果您知道“布朗运动”这个词的话，那么一定会常常看到这种图像。

图19-2 带有行迹的布朗运动
    当我们要让物体以无意识、无外力的形式运动时，那么布朗运动将是最为实用的。也可以将它加入到一个带有其它运动的影片中，这样会给人一种随意（randomness）的感觉。例如到处乱飞的苍蝇或蜜蜂。也许这些影片已经有了它们各自的运动路径，但是在加入了一些随机运动后会让它看起来更加栩栩如生。

随机分布
    有时候我们会创建一些物体并将它们随机放置。您已经在本书中看到了很多这样的例子，但是下面我们要来关注几种不同的方法，获得不同的结果。

方形分布
    如果你想让物体随机分布在整个舞台上，那是相当简单的。只需要选择一个舞台宽度的随机数作为 x，一个高度的随机数作为 y。事实上，我们上一节就是这么做的：
for (var i:uint = 0; i < numDots; i++) {
 var dot:Ball = new Ball(1, 0);
 dot.x = Math.random() * stage.stageWidth;
 dot.y = Math.random() * stage.stageHeight;
 ...
}
但是如果说我们要让这些点集中分布在舞台中心，比如舞台中心上方 100 像素为顶，下方 100 像素为底。我们可以这样做，可见 Random1.as：
package {
 import flash.display.Sprite;
 public class Random1 extends Sprite {
  private var numDots:uint = 50;
  public function Random1() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    dot.x = stage.stageWidth / 2 +
    Math.random() * 200 - 100;
    dot.y = stage.stageHeight / 2 +
    Math.random() * 200 - 100;
    addChild(dot);
   }
  }
 }
}
这里创建了一个从 -100 到 +100 的随机数，并将它加到舞台中心点上，因此所有的点在每个轴上都不能超过 100 像素。如图 19-3 所示。

图19-3 随机安排的点
    不赖嘛。但是如果让它们挤在一起，增加点的数量（300）并减少随机范围为 50，我们将看到一些奇怪的事情。以下代码来自 Random2.as：
package {
 import flash.display.Sprite;
 public class Random2 extends Sprite {
  private var numDots:uint = 300;
  public function Random2() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    dot.x = stage.stageWidth / 2 +
    Math.random() * 100 - 50;
    dot.y = stage.stageHeight / 2 +
    Math.random() * 100 - 50;
    addChild(dot);
   }
  }
 }
}
图 19-4 为运行结果。

图19-4 这种方法形成了一个方形。看起来不再像是随机安排的
    如您所见，这些点形成了一个正方形。这样没问题，但是如果我们要制作一些爆炸效果或星系效果等，正方形看起来就不那么自然了。如果正方形分布不是您真正想要的，那么就继续下一项技术吧。

圆形分布
    虽然圆形分布比方形分布稍稍复杂一点，但是它真的也不难。
    首先，我们需要知道圆的半径。为了与上一个例子呼应，这里仍然使用 50。这将是从舞台中心开始能够放置的最大半径。我们将从 0 到 50 之间取一个随机数作为点的位置。然后从 0 到 PI * 2 个弧度 (360 度)选择一个随机的角度，再使用三角形函数找出点的 x 和 y 坐标。以下是 Random3.as 的代码：
package {
 import flash.display.Sprite;
 public class Random3 extends Sprite {
  private var numDots:uint = 300;
  private var maxRadius:Number = 50;
  public function Random3() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    var radius:Number = Math.random() * maxRadius;
    var angle:Number = Math.random() * (Math.PI * 2);
    dot.x = stage.stageWidth / 2 +
    Math.cos(angle) * radius;
    dot.y = stage.stageHeight / 2 +
    Math.sin(angle) * radius;
    addChild(dot);
   }
  }
 }
}
运行结果如图 19-5 所示。

图19-5 圆形随机分布
    这就是我前面提到的那种更加自然的分布形式。大家也许注意到了这些点似乎更集中于圆形的中心。因为点是沿着半径平均的分布的，这就会使中心的点与边上的点同样多。但是因为中心的空间小，也就会显得更加拥挤。
    这样的效果也许对于某些程序来说很好，但是 O’Shell (www.pixelwit.com) 的 Sean 曾给我一次挑战，让我给出一种方法将这些点均匀地分布成圆形。不得不承认我被难倒了，我的解决方法非常复杂。最后他给了我一个非常简单的办法，可见 Random4.as：
package {
 import flash.display.Sprite;
 public class Random4 extends Sprite {
  private var numDots:uint = 300;
  private var maxRadius:Number = 50;
  public function Random4() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    var radius:Number = Math.sqrt(Math.random()) * maxRadius;
    var angle:Number = Math.random() *
    (Math.PI * 2);
    dot.x = stage.stageWidth / 2 +
    Math.cos(angle) * radius;
    dot.y = stage.stageHeight / 2 +
    Math.sin(angle) * radius;
    addChild(dot);
   }
  }
 }
}
通过取随机数的平方根，所得的结果偏向 1 而远离 0，这样做足以使分布变均匀。运行结果如图 19-6 所示。Sean，好人呀！

图19-6 更为均衡的分布

偏向分布
    最后，我们也许还想让物体自由地分布在整个舞台上，但是要让它们趋于在中心区域分布。我们已经找到了分布在边缘的方法，而现在要让它们越接近中心越多。这就有点像第一个圆形分配的例子，只不过这次要运用在矩形区域中。
    我们为每个坐标生成一个随机数，然后求它们的平均数得到最终的值。例如，假设舞台有 500 像素宽。如果为每个对象随机生成一个 x 坐标，那么每个对象分布在哪里的概率都是相同的。但是如果从 0 到 500 产生两个随机数，再求平均，那么被置在舞台中心的机会就会略高一些。
    让我们更深入地看一看这个问题。我们有一定的概率让两个数都在较“高”的范围内，假设从 300 到 500。让两个数都得到较低范围的概率也几乎相同，从 0 到 200。但是相比而言，一个数较高而另一个数较低，或者一个数居中另一个数较高或较低，或者都处于中等水平的概率要更高。所有这些可能性的平均值将使大多数点更靠近舞台中心。
    OK，让我们来看代码。像平常一样，从一维的开始。下面是代码（可以在 Random5.as 中找到）：
package {
 import flash.display.Sprite;
 public class Random5 extends Sprite {
  private var numDots:uint = 300;
  public function Random5() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    var x1:Number = Math.random() * stage.stageWidth;
    var x2:Number = Math.random() * stage.stageWidth;
    dot.x = (x1 + x2) / 2;
    dot.y = stage.stageHeight / 2 +
    Math.random() * 50 - 25;
    addChild(dot);
   }
  }
 }
}
这里我们创建了两个随机数 x1 和 x2，并设置 dot 的 x 坐标为它们的平均值。y 坐标只是邻近舞台中心点的一个简单的随机数。运行结果如图 19-7 所示。

图19-7 一次迭代的偏向分布
    虽然这个效果不是很明显，但是我们已经可以看到中心位置比边缘位置的点更多一些。创建更多的随机值，再取它们的平均值，会使效果更加明显。我们可以将它放入一个 for 循环中动态执行（Random6.as）：
package {
 import flash.display.Sprite;
 public class Random6 extends Sprite {
  private var numDots:uint = 300;
  private var maxRadius:Number = 50;
  private var iterations:uint = 6;
  public function Random6() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    var xpos:Number = 0;
    for (var j:uint = 0; j < iterations; j++) {
     xpos += Math.random() * stage.stageWidth;
    }
    dot.x = xpos / iterations;
    dot.y = stage.stageHeight / 2 +
    Math.random() * 50 - 25;
    addChild(dot);
   }
  }
 }
}
这里 iterations 变量控制要取多少个数的平均值。开始让 xpos 变量等于 0，然后将每个随机数都加在上面。最后，用这个结果除以 iterations 得到最终的值。运行结果如图 19-8。

图19-8 六次迭代的偏向分布
    现在，要 y 轴也做同样的事就非常简单了，Random7.as：
package {
 import flash.display.Sprite;
 public class Random7 extends Sprite {
  private var numDots:uint = 300;
  private var maxRadius:Number = 50;
  private var iterations:uint = 6;
  public function Random7() {
   init();
  }
  private function init():void {
   for (var i:uint = 0; i < numDots; i++) {
    var dot:Ball = new Ball(1, 0);
    var xpos:Number = 0;
    for (var j:uint = 0; j < iterations; j++) {
     xpos += Math.random() * stage.stageWidth;
    }
    dot.x = xpos / iterations;
    var ypos:Number = 0;
    for (j = 0; j < iterations; j++) {
     ypos += Math.random() * stage.stageHeight;
    }
    dot.y = ypos / iterations;
    addChild(dot);
   }
  }
 }
}
这种分布如图 19-9 所示。

图19-9 二维的偏向分布
    在我看来，这是所有分布效果中最无规律，最具爆发性，最像星系的一种分布，虽然它也是最复杂的。好了，我们现在至少已经掌握了四种生成随机位置的方法。

矩阵基础
    矩阵最简单的定义是一个数字表格。它可以有一个或多个水平的行和一个或多个垂直的列。图 18-1 展示了一些矩阵。

图18-1 一个 3×3 矩阵，一个 1×3 矩阵，一个 3×1 矩阵
    矩阵通常都是由一些变量来描述的，如 M。在矩阵中为表示一个特殊的单元，我们使用的变量里面通常要用行列的值作为脚标。例如，如果图 18-1 中的 3×3 矩阵叫做 M，那么 M2,3 就等于 6，因为它指向第二行，第三列。
    一个矩阵的单元不仅可以包含简单的数字，也可以是公式和变量。其实电子表格就是一个大的矩阵。我们可以用一个单元保存某一列的和，用另一个单元格将这个总和乘以一个分数，等等。我们看到这样的矩阵应该非常有用。

矩阵运算
    一个电子表格就像一个自由组合的矩阵，我们要处理的矩阵更加有结构，至于能用它们做什么以及如何生成都有各自的规则。
    我所见过的大多数矩阵数学的教材都只介绍两种方法的一种。首先学校讲的是矩阵运算的细节，使用的整个矩阵的几乎都是一些随机的数字。我们学习这些规则，但是不知道为什么要做这些事情或所得的结果代表什么。就像在玩把数字排列成漂亮形状的游戏。
    第二个方法是详细地描述矩阵的内容但是略过手工操作，如“将两个矩阵相乘得到这个结果… …”让读者不知道乘法到底是怎么算的。
    为了保证大家都能了解矩阵是如何工作的，我选择一个两者兼具的方法（折衷），从介绍一些数值矩阵开始，然后描述如何做矩阵乘法。

矩阵加法
    矩阵更为通常的作用是操作 3D 点。一个 3D 点包涵了 x, y, z 坐标。我们可以简单地将它视为一个 1×3 的矩阵：
    x  y  z
现在假设要将这个点在空间中移动，或叫做点的平移。我们需要知道每个轴上移动多远。这时可以将它放入一个转换矩阵（translation matrix）中。它又是一个 1×3 的矩阵：
    dx  dy  dz
这里 dx, dy, dz 是每个轴移动的距离。现在我们要想办法将转换矩阵加到点矩阵上面。这就是矩阵加法，非常简单。我们只需要将相应的单元进行相加形成一个新的包含了每个单元之和的矩阵。很明显，要让两个矩阵相加，它们的大小都应该是相同的。转换方法如下：
    x  y  z  +  dx  dy  dz = (x + dx) (y + dy) (z + dz)
获得的矩阵可以叫做 x1, y1, z1，转换之后包含了该点的新坐标。让我们用实数来试一下。假设点在 x, y, z 轴上的位置分别为 100, 50, 75，要让它们分别移动 -10, 20, -35。则应该是这样的：
    100  50  75  +  -10  20  -35 = (100 - 10) (50 + 20) (75 - 35)
因此，当进行加法运算时，所得该点的新坐标就是 90, 70, 40。非常简单，不是吗？大家也许已经注意到了速度间的相互关系，每个轴上的速度都加到了另一个矩阵的相应位置上。公平交易嘛。
    如果我们有一个较大的矩阵，那么继续使用同样的方法，匹配每个单元。我们不会去处理大于 3×1 的矩阵加法，但是我会给大家这样一个抽象的例子：
    a  b  c        j  k  l      (a + j) (b + k) (c + l)
    d  e  f   +    m  n  o   =  (d + m) (e + n) (f + o)
    g  h  i        p  q  r      (g + p) (h + q) (i + r)
以上就是我们需要知道矩阵加法的一切。在介绍了矩阵乘法之后，我将展示如何将现有的函数使用在矩阵 3D 引擎中。

矩阵乘法
    在 3D 转换中应用更为广泛的是矩阵乘法（matrix multiplication），常用于缩放与旋转。在本书中我们实际上不会用到 3D 缩放，因为例子中的点缩放，影片也没有 3D 的“厚度”，因此只有二维的缩放。当然，大家可以建立一个可缩放整个 3D 立体模型的更为复杂的引擎。这就需要写一些根据新的影片大小改变 3D 点的函数。这些已经超出了我们讨论的范围，但是由于缩放是非常简单的，并且使用矩阵乘法很容易实现，因此我将带大家看一下这个例子。

使用矩阵进行缩放
   首先，需要知道一个物体现有的宽度，高度和深度 —— 换句话讲，它是三个轴上每个轴分量的大小。当然可以建立一个 3×1 的矩阵：
    w  h  d
我们知道 w, h, d 代表宽度（width），高度（height）和深度（depth）。下面需要缩放这个矩阵：
    sx  0  0
    0  sy  0
    0  0  sz
这里 sx, sy, sz 是对应轴上的缩放比例。它们都将是分数或小数，1.0 为 100%，2.0 为 200%，0.5 为 50%，等等。稍后大家会看到为什么矩阵是用这种形式分布的。
    要知道，矩阵乘法是为了让两个矩阵相乘，第一个矩阵的列数必需与另一个矩阵的行数相同。只要符合这个标准，第一个矩阵可以有任意多个行，第二个矩阵可以有任意多个列。本例中，由于第一个矩阵有三列（w, h, d），因此缩放矩阵就有三行。那么它们如何进行乘法运算呢？让我们来看一下这个模式：

矩阵的计算结果如下：
    (w*sx + h*0 + d*0) (w*0 + h*sy + d*0) (w*0 + h*0 + d*sz)
删除所有等于 0 的数：
    (w*sx) (h*sy) (d*sz)
非常有合乎逻辑，因为我们是用宽度（x 轴分量）乘以 x 缩放系数，高度乘以 y 缩放系数，深度乘以 z 缩放系数。但是，我们究竟在做什么呢？那些所有等于 0 的数都像被遮盖上了，因此让我们将这个模式抽象得更清晰一点。

现在可以看到该模式的结果为：
    (u*a + v*d + w*g) (u*b + v*e + w*h) (u*c + v*f + w*i)
我们将第一个矩阵的第一行（u, v, w）与第二个矩阵每行的第一个元素相乘。将它们加起来就得到了结果的第一行的第一个元素。在第二个矩阵的第二列（b, e, h）中使用相同的方法就得到了第二列的结果。
    如果第一个矩阵的行数大于 1，就要在第二行中重复上述动作，就会得到第二行的结果：

使用矩阵进行坐标旋转
首先，要挖出我们的 3D 点矩阵：
    x  y  z
它保存了该点所有的坐标。当然，还要有一个旋转矩阵。我们可以在三个轴的任意一轴上进行旋转。我们将分别创建每种旋转的矩阵。先从 x 轴旋转矩阵开始：
    1   0     0
    0  cos   sin
    0  -sin  cos
这里有一些正余弦值，“sin 和 cos 是什么？”很明显，这就是我们要旋转的角度的正余弦值。如果让这个点旋转 45 度，则这两个值就是 45 的正弦和余弦值。（当然，在代码中要使用弧度制）现在，我们让该矩阵与一个 3D 点的矩阵相乘，看一下结果。

编写矩阵
    OK，现在大家已经有了足够的基础将这些知识转换为代码了。下面，我们对第十五章的 RotateXY.as 进行重新转换。这个类中有 rotateX 和 rotateY 两个方法，用以实现 3D 坐标旋转。我们要让它们以矩阵的方式工作。
    从 rotateX 函数开始。它会用到小球的 x, y, z 坐标，将它们放入 1×3 矩阵，然后创建一个给定角度的 x 旋转矩阵。这个矩阵将使用数组的形式表示。最后使用 matrixMultiply 函数让两个矩阵相乘，当然还需要创建这个函数！相乘后的矩阵还要用另一个数组进行保存，因为我们需要将这些数值再存回小球的 x, y, z 坐标中。下面是新版的方法：
private function rotateX(ball:Ball3D, angleX:Number):void {
 var position:Array = [ball.xpos, ball.ypos, ball.zpos];
 var sin:Number = Math.sin(angleX);
 var cos:Number = Math.cos(angleX);
 var xRotMatrix:Array = new Array();
 xRotMatrix[0] = [1, 0, 0];
 xRotMatrix[1] = [0, cos, sin];
 xRotMatrix[2] = [0, -sin, cos];
 var result:Array = matrixMultiply(position, xRotMatrix);
 ball.xpos = result[0];
 ball.ypos = result[1];
 ball.zpos = result[2];
}
下面是矩阵乘法的函数：
private function matrixMultiply(matrixA:Array, matrixB:Array):Array {
 var result:Array = new Array();
 result[0] = matrixA[0] * matrixB[0][0] +
 matrixA[1] * matrixB[1][0] +
 matrixA[2] * matrixB[2][0];
 result[1] = matrixA[0] * matrixB[0][1] +
 matrixA[1] * matrixB[1][1] +
 matrixA[2] * matrixB[2][1];
 result[2] = matrixA[0] * matrixB[0][2] +
 matrixA[1] * matrixB[1][2] +
 matrixA[2] * matrixB[2][2];
 return result;
}
现在，这个矩阵乘法的函数是手工写出的一个 1×3 和 3×3 矩阵的乘法，这就是我们后面用在每个例子中的函数。大家也可以使用 for 循环创建出更为动态的可处理任何大小的矩阵函数，但是现在我要让代码保持简洁。
    最后创建 rotateY 函数。如果你了解 rotateX 函数，那么这个函数应该非常显而易见了。只需要创建一个 y 旋转矩阵来代替 x 旋转矩阵即可。
private function rotateY(ball:Ball3D, angleY:Number):void {
 var position:Array = [ball.xpos, ball.ypos, ball.zpos];
 var sin:Number = Math.sin(angleY);
 var cos:Number = Math.cos(angleY);
 var yRotMatrix:Array = new Array();
 yRotMatrix[0] = [ cos, 0, sin];
 yRotMatrix[1] = [ 0, 1, 0];
 yRotMatrix[2] = [-sin, 0, cos];
 var result:Array = matrixMultiply(position, yRotMatrix);
 ball.xpos = result[0];
 ball.ypos = result[1];
 ball.zpos = result[2];
}
就是这样。大家也可以创建一个 rotateZ 函数，由于我们的例子中实际上不需要用到它，所以我将它作为练习留给大家完成。
    现在，运行一下 RotateXY.as，与第十五章的版本相比，它们看上去实际是一样的。在 AS 2 中，我发现非矩阵版本的运行得更为流畅一些。原因是我们为 3D 旋转和缩放执行了非常大量的数学运算。当我们使用矩阵数学进行计算时，会产生额外的计算。在进行矩阵乘法时，我们实际是做了四次乘以零的操作，并将这四个结果与其它数值相加。这八次数学运算实际上没有任何作用。将这些操作乘以 50 个对象，每帧旋转二次，每帧就多做了 800 次额外计算！这两个版本在 AS 3 中的运行时看不出任何的不同，这就是 Flash CS3 与 AS 3 强大的证明。但是，当加入的物体越来越多时，我们就要为这些巨大的计算量付出代价。我给大家的这些代码都非常基本的。你也许可以使它更加优化一些，让性能得到提升。
 即使在 3D 中不使用矩阵，我们仍可以发现它们在其它方面的用途，我将在下面一节进行介绍。在 3D 中使用矩阵是一个很好的引子，因为这样可以让大家看到它们是如何与已知公式相关联的。同样，矩阵在其它语言的 3D 制作中应用得非常之广泛，而且比我们现在的 ActionScript 更为有效。在这些语言中，只需付出一点点 CPU 就可以得到矩阵所带来的组织良好的代码。如果大家试图在 Flash 以外的其它软件中进行 3D 动画编程，那么就一定要使用到矩阵。还是那句话，谁知道 Flash 播放器几年后会成为什么样？终会有一天，所有的这些技术都能与 Flash 完美地结合。

Matrix 类
    刚刚提到，学习矩阵的一个很好的理由是它被用在许多 ActionScript 类的内核中。事实上，我们有一个内置矩阵类。浏览一下 Flash 帮助文档中的 flash.geom.Matrix 类，就会发现那里写得非常清楚详细。如果本章前面内容您都能理解，那么要掌握这些材料就一定没问题。文档写得非常好，我就不再浪费空间将这些内容重复一遍了，但是我会给大家一个快速的总结并举出两个例子。
    矩阵主要用于对显示对象的转换（旋转，缩放和平移）。现在，任何一个显示对象（Sprite，影片剪辑，文本类等）都有名为 transform （转换）的属性。这是 flash.geom.Transform 类的一个实例，它还包含有另一个名为 matrix 的属性。如果我们创建一个 Matrix 类的实例，并把它赋给显示对象的 transform.matrix 属性，那么它将会改变这个对象的形状、大小或位置。我们马上会看到一些具体的例子。
基本来说 Matrix 类的矩阵是一个 3×3 的矩阵，形式如下：
    a  b  tx
    c  d  ty
    u  v  w
其中 u, v, w 内部自动被设置为 0, 0, 1。而且它们是不可改变的，因此不需要管它们。（更为具体的解释请参见帮助文档）我们使用下述语法来创建一个新的 Matrix：
    import flash.geom.Matrix;
    var myMatrix:Matrix = new Matrix(a, b, c, d, tx, ty);
那么这些字母是什么意思呢？tx 和 ty 非常简单。它们通过改变矩阵来控制显示对象的 x 和 y 轴。而 a, b, c, d 有些难度，因为它们都相互依赖。如果设置 b 和 c 为 0，就可以使用 a 和 d，在 x 和 y 轴上缩放一个对象。如果设置 a 和 d 为 1，就可以使用 b 和 c，分别在 y 和 x 轴上倾斜一个对象。最后，可以用一种我们非常熟悉的方式来使用 a, b, c, d。在本例中，设置如下：
    cos  sin  tx
   -sin  cos  ty
     u    v   w
当然，我们可以看到这里包含了一个旋转矩阵，它确实可以旋转一个物体。自然本例中的 cos  和 sin 代表我们想要旋转的某个角度的正弦和余弦值（弧度制）。让我们试验一下这个例子。
    这里可见 MatrixRotate.as，这个类中用红色正方形创建了一个简单影片。然后设置一个 enterFrame 处理函数，所有的动作都加在其中：
package {
 import flash.display.Sprite;
 import flash.events.Event;
 import flash.geom.Matrix;
 public class MatrixRotate extends Sprite {
  private var angle:Number = 0;
  private var box:Sprite;
  public function MatrixRotate() {
   init();
  }
  private function init():void {
   box = new Sprite();
   box.graphics.beginFill(0xff0000);
   box.graphics.drawRect(-50, -50, 100, 100);
   box.graphics.endFill();
   addChild(box);
   addEventListener(Event.ENTER_FRAME, onEnterFrame);
  }
  private function onEnterFrame(event:Event):void {
   angle += .05;
   var cos:Number = Math.cos(angle);
   var sin:Number = Math.sin(angle);
   box.transform.matrix = new Matrix(cos, sin,
   -sin, cos,
   stage.stageWidth / 2,
   stage.stageHeight / 2);
  }
 }
}
这里有一个 angle 变量，每帧都会增加。代码求出了角度的正弦和余弦值并将它们赋给新的矩阵对象，以这种方式指定 rotation。我同时还设置了平移，根据舞台的宽度和高度把影片放置到中心。新的矩阵被赋给了影片的 transform.matrix 属性。测试该影片就得到了一个旋转的正方形。
    现在，也许有人会问，你什么不改变影片的 rotation 属性。在一个简单的例子中使用 rotation 没有问题，这是一个更为简单的解决方法。但是，也许在一些处理多个角度、弧度、正弦、余弦的例子中，相比将一切转换回角度制并改变 rotation 值而言，像这样的矩阵赋值确实要简单很多。
    再给大家一些实际的说明，让我们试一下倾斜。倾斜（Skewing）意思是将物体在一个轴上进行拉伸以便使一个部分走一条路，另一个部分走另一条路。斜体字就是一个倾斜的例子。字母顶部的部分向右倾斜，而底部的部分向左倾斜。这是 Flash 中一个众所周知的一个难点，但是使用 Matrix 类将会惊人地简单。如同我前面所说，设置矩阵的 a 和 d 为 1。属性 b 是 y 轴倾斜的值，属性 c 控制 x 轴的倾斜值。让我们先来试一下 x 倾斜。在 SkewX.as 中，我几乎使用了与前一个例子完全相同的设置，只不过改变了 onEnterFrame 方法中矩阵的创建。
private function onEnterFrame(event:Event):void {
 var skewX:Number = (mouseX - stage.stageWidth / 2) * .01;
 box.transform.matrix = new Matrix(1, 0,
 skewX, 1,
 stage.stageWidth / 2,
 stage.stageHeight / 2);
}
这里相对于鼠标的 x 坐标创建了一个 skewX 变量，以舞台的中心为偏移量。然后将它乘以 .01 让倾斜的值处于可控范围，并将此值赋给矩阵。
    测试影片后，我们将看到如何让一个完整的影片进行倾斜，如图 18-2 所示。有了 Matrix 类一切都变得可能，如果你知道有谁在试图做这样的事，那么就把上述代码拿给他们看，等着看他们开始流口水吧！如果您亲自测试了这段代码，那么肯定已经知道我的意思了。

图18-2 影片在 x 轴上的倾斜
在 SkewXY 中，我在 y 轴上做了同样的事情：
private function onEnterFrame(event:Event):void {
 var skewX:Number = (mouseX - stage.stageWidth / 2) * .01;
 var skewY:Number = (mouseY - stage.stageHeight / 2) * .01;
 box.transform.matrix = new Matrix(1, skewY,
 skewX, 1,
 stage.stageWidth / 2,
 stage.stageHeight / 2);
}
从图18-3 中可以看到影片在两个轴上的倾斜

图18-3 影片在两个轴上的倾斜
如此简单就能实现这样的效果的确让人惊喜。如果您不确定这种效果能用在哪里，那么我告诉您，倾斜效果在伪 3D 效果中使用得非常频繁。当我们在上个例子中移动鼠标时，如果这个图形正在倾斜并旋转，那么大家已经可以看到了它是如何显示出透视来的。这不是特别精确的 3D，但是它可以用在一些非常棒的效果中。在网上有一些这方面的教程，告诉我们如何使用倾斜实现这种伪 3D 效果。Matrix 的使用也许会将代码缩短一半。
    大家一定要为 Matrix 类查一查帮助文档，因为这里还有其它好多好东西。要知道上述这些并不是 AS 3 唯一使用矩阵的地方。大家还应该看看 ColorMatrixFilter，ConvolutionFilter，这些不同的制图 API 填充和渐变的方法，以及 flash.geom.Transform 类。所以说矩阵的应用非常广泛！

全屏观看地址：

视频1地址

视频2地址

视频3地址

源文件及 PPT 下载：

http://www.fs2you.com/files/76b3bea8-41d3-11dd-ba6f-001143e7b41c/

代码公布（数字版）：

Card.as：

package {
 import flash.display.Sprite;
 import flash.text.TextField;
 import flash.text.TextFormat;
 import flash.filters.*;
 import flash.events.MouseEvent;

 public class Card extends Sprite {
  public var id:int;
  public var W:Number = 30;
  public var H:Number = 40;
  public var i:int;
  public var j:int;
  public var TargetCard:Card;
  private var color:uint = 0xcccccc;
  public var Path:Array = new Array();
  private var pressed:Boolean = false;
  
  public var line:Sprite = new Sprite();
  public function Card(id:int) {
   this.id = id;
   init();
  }

  function init():void {
   graphics.beginFill(color);
   graphics.drawRect(0,0,W,H);
   graphics.endFill();
   var Text:TextField = new TextField();
   Text.text = String(id);
   Text.selectable = false;
   Text.autoSize = "left";

   var tf:TextFormat = new TextFormat(null,25);
   // tf.size = 25;

   Text.setTextFormat(tf);
   addChild(Text);
   
   addEventListener(MouseEvent.MOUSE_OVER, MouseOver);
   addEventListener(MouseEvent.MOUSE_OUT, MouseOut);
  }

  function setIndex(a:int, b:int):void {
   i = a;
   j = b;
  }
  function Pressed():void {
   pressed = true;
  }
  function UnPressed():void {
   pressed = false;
   this.filters = null;
  }
  function MouseOver(evt:MouseEvent):void {
   var blur:BevelFilter = new BevelFilter();
   var shadow:DropShadowFilter = new DropShadowFilter(10);
   var f:Array = new Array();
   f.push(blur);
   f.push(shadow);
   this.filters = f;
  }
  function MouseOut(evt:MouseEvent):void {
   if (pressed == false) {
    this.filters = null;
   }
  }

 }
}

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

Main.as

package {
 import flash.display.Sprite;
 import flash.events.MouseEvent;
 import flash.events.Event;
 public class Main extends Sprite {
  var Row:uint = 4;
  var Colum:uint = 5;
  var MarginLeft:Number = 180;
  var MarginTop:Number = 100;

  var oldCard:Card;
  var map:Array;

  public function Main() {
   init();
  }
  
  function init():void {
   map = new Array(Row + 2);

   var numArray:Array = new Array();
   for (var i:uint = 0; i < Row; i++) {
    numArray[i] = new Array();
    var num:uint = 0;
    for (var j:uint = 0; j < Colum; j++) {
     numArray[i][j] = ++num;
    }
   }
   for (i = 0; i < Row; i++) {
    for (j = 0; j < Colum; j++) {
     var Rani:uint = Math.floor(Math.random() * Row);
     var Ranj:uint = Math.floor(Math.random() * Colum);

     var temp:uint = numArray[i][j];
     numArray[i][j] = numArray[Rani][Ranj];
     numArray[Rani][Ranj] = temp;
    }
   }

   for (i = 0; i < Row + 2; i++) {
    map[i] = new Array(Colum + 2);
    for (j = 0; j < Colum + 2; j++) {
     if (i ==0 || j ==0 || i == Row + 1 || j == Colum + 1) {
      map[i][j] = 0;
     } else {
      map[i][j] = 1;
     }
    }
   }
   
   for (i = 0; i < Row; i++) {
    for (j = 0; j < Colum; j++) {
     var card:Card = new Card(numArray[i][j]);
     addChild(card);
     card.x = MarginLeft + j * (card.W + 2);
     card.y = MarginTop + i * (card.H + 2);
     card.setIndex(i + 1, j + 1);
     card.addEventListener(MouseEvent.CLICK, onClick);
    }
   }
  }
  function onClick(evt:MouseEvent):void {
   try {
    var currentCard:Card = Card(evt.target.parent);
   } catch (error:Error) {
    currentCard = Card(evt.target);
   }
   if (oldCard == null) {
    oldCard = currentCard;
    oldCard.Pressed();
   } else {

    oldCard.TargetCard = currentCard;
    // successfully matched!
    if (isMatched()) {
     addChild(oldCard.line)
     oldCard.line.graphics.clear();
     oldCard.line.graphics.lineStyle(2);
     
     var node:Object = oldCard.Path.shift();
     oldCard.line.graphics.moveTo(MarginLeft + node.y * oldCard.W - oldCard.W / 2, MarginTop + node.x * oldCard.H - oldCard.H / 2);
     
     oldCard.addEventListener(Event.ENTER_FRAME, ToLink);
     oldCard = null;

    } else {
     // Can not Match!
     oldCard.UnPressed();
     oldCard = null;
    }
   }
  }

  function ToLink(evt:Event):void {
   var card:Card = Card(evt.target);
   if (card.Path.length > 0) {
    var node:Object = card.Path.shift();
    card.line.graphics.lineTo(MarginLeft + node.y * card.W - card.W / 2, MarginTop + node.x * card.H - card.H / 2);
   } else {
    
    map[card.i][card.j] = 0;
    map[card.TargetCard.i][card.TargetCard.j] = 0;
    card.removeEventListener(Event.ENTER_FRAME, ToLink);
    removeChild(card);
    removeChild(card.line);
    removeChild(card.TargetCard);
   }
  }
  
  function isMatched():Boolean {
   if (oldCard == oldCard.TargetCard || oldCard.id != oldCard.TargetCard.id) {
    return false;
   }
   
   var x1:uint = oldCard.i;
   var y1:uint = oldCard.j;
   var x2:uint = oldCard.TargetCard.i;
   var y2:uint = oldCard.TargetCard.j;
   
   var node:Object = new Object();
   var tempPath:Array = new Array();
   
   for (var i:uint = 0; i < Colum + 2; i++) {
    var count:uint = 0;
    tempPath.splice(0);
    
    var step:int = (y1 > i) ? -1 : 1;
    for (var j = y1; j != i; j += step) {
     count += map[x1][j];
     node = {x:x1,y:j};
     tempPath.push(node);
    }

    step = (x1 > x2) ? -1 : 1;
    for (j = x1; j != x2; j += step) {
     count += map[j][i];
     node = {x:j,y:i};
     tempPath.push(node);
    }

    step = (i < y2) ? 1 : -1;
    for (j = i; j != y2; j+= step) {
     count += map[x2][j];
     node = {x:x2,y:j};
     tempPath.push(node);
    }

    if (count == 1) {
     if (oldCard.Path.length == 0 || tempPath.length < oldCard.Path.length) {
      oldCard.Path = tempPath.slice();
     }
    }
   }

   for (i = 0; i < Row + 2; i++) {
    count = 0;
    tempPath.splice(0);

    step = (i < x1) ? -1 : 1;
    for (j = x1; j != i; j += step) {
     count += map[j][y1];
     node = {x:j,y:y1};
     tempPath.push(node);
    }
    step = (y2 > y1) ? 1 : -1;
    for (j = y1; j != y2; j += step) {
     count += map[i][j];
     node = {x:i,y:j};
     tempPath.push(node);
    }
    step = (x2 > i) ? 1 : -1;
    for (j = i; j != x2; j += step) {
     count += map[j][y2];
     node = {x:j,y:y2};
     tempPath.push(node);
    }
    if (count == 1) {
     if (oldCard.Path.length == 0 || tempPath.length < oldCard.Path.length) {
      oldCard.Path = tempPath.slice();
     }
    }
   }
   
   if (oldCard.Path.length > 0) {
    node = {x:x1, y:y1};
    oldCard.Path.unshift(node);
    node = {x:x2, y:y2};
    oldCard.Path.push(node);
    return true;
   }
   return false;
  }
 }
}