HTML5 Canvas核心技术—图形、动画与游戏开发.pdf8

第6章 精灵

精灵（sprite），它是一种可以集成入动画之中的图像对象，赋予它们各种行为，精灵并非Canvas API的一部分，，但都是从它衍生而来

本章将会实现三种设计模式：策略模式（精灵与绘制器解耦）、命令模式（精灵的动作）、享元模式（一个实例表示多个精灵）

painter属性是一个指向Painter对象的引用，使用paint(sprite,context)方法来绘制精灵，behaviors属性指向一个对象数组，数组中每个对象都会以execute(sprite,context,time)方法对精灵进行某种形式的操作。

精灵对象有两个方法paint()与update()，update()方法执行精灵的行为，执行的顺序为被加入的顺序，paint()方法则将精灵的绘制代理给绘制器来做

所有Painter对象都可以被归纳为以下三类：描边及填充绘制器、图像绘制器、精灵表绘制器

精灵对象不需要自己完成绘制，它会将绘制操作代理给另外一个对象来做。本质上讲Painter对象就是一些可以互相交换着使用的绘制算法

一张图片里包含动画的每一帧图片，就叫做精灵表（sprite sheet），复制一张图片比复制多张图片速度要快的多

第7章 物理效果

模拟重力加速度9.81m/s²转换为像素/米

抛物体垂直速度

钟摆运动

时间轴扭曲就是那些与时间呈非线性变化的属性（位置、颜色等）

第8章 碰撞检测

分离轴定理，也叫超平面分离定理，SAT

外接图形判别法：在二维平面中执行碰撞检测时，通常会根据物体外接图形的面积来判定（三维空间则按照体积）

外接矩形判别法：外接矩形经常被当作物体的轮廓来参与碰撞检测

事前碰撞检测，可以提前探知是否发生碰撞，由于这是根据当前帧速率来估算，如果帧速率变化，就会出错

外接圆判别法：两个圆心的距离小于两圆的半径只和

事后碰撞检测法，在碰撞发生后在做判断（是否已经发生了碰撞）

光线投射法，根据两条线相交的部分判定

以上方法并不适用任意多边形之间的碰撞检测，分离轴定理（SAT）与最小平移向量（MTV），分离轴定理只适用于凸多边形（所有内角小于180°）

分离轴定理（SAT）相当于将物体的阴影投到一面墙上，阴影重叠则碰撞，阴影部分数学上叫投影，墙叫做轴

只要在任意一条轴上找到互相分离的投影，就可以立即结束检测过程，判定未发生碰撞

投影轴

p1指向p2的向量叫做边缘向量，还需要一条垂直于边缘向量的法向量，叫做边缘法向量

圆形与多边形的碰撞检测，圆形可以近似看成一个有无数条边的正多边形

最小平移向量，指的是不再与另一个物体相撞所需要的最小距离

碰到后弹开

--------------------代码部分后期处理--------------------

本书完