缓动(Easing)
下面是缓动的实现策略:
1. 确定一个数字作为运动比例系数,这是个小于 1 的分数;
2. 确定目标点;
3. 计算物体与目标点的距离;
4. 用距离乘以比例系数,得出速度向量;
5. 将速度向量加到当前物体坐标上;
6. 重复 3 到 5 步。
Ease In
Start slow and speed up.
Math.easeInQuad = function (t, b, c, d) {
return c*(t/=d)*t + b; // totalVector * curTotalTime * curTotalTime + startPoint;
};
Recall that t is time, b is beginning position, c is the total change in position, and d is the duration of the tween.
Ease Out
Start fast and slow down.
Math.easeOutQuad = function (t, b, c, d) {
return -c * (t/=d)*(t-2) + b;
};
The original quadratic curve needed to be massaged a bit to get it where I
wanted it. I multiplied c by -1 to flip the curve vertically. I also had to play
with the value of t to shift the curve into place.
Ease In Out
Math.easeInOutQuad = function (t, b, c, d) {
if ((t/=d/2) < 1) return c/2*t*t + b;
return -c/2 * ((--t)*(t-2) - 1) + b;
};
碰撞检测:
多重物体的检测优化:
下面列出每次比较的过程:
sprite0 与 sprite1, sprite2, sprite3, sprite4, sprite5 进行比较
sprite1 与 sprite0, sprite2, sprite3, sprite4, sprite5 进行比较
sprite2 与 sprite0, sprite1, sprite3, sprite4, sprite5 进行比较
sprite3 与 sprite0, sprite1, sprite2, sprite4, sprite5 进行比较
sprite4 与 sprite0, sprite1, sprite2, sprite3, sprite5 进行比较
sprite5 与 sprite0, sprite1, sprite2, sprite3, sprite4 进行比较
请看第一次判断:用 sprite0 与 sprite1 进行比较。再看第二行:sprite1 与 sprite0 进行比较。它俩是一回事,对吧?如果 sprite0 没有与 sprite1 碰撞,那么 sprite1 也肯定不会与 sprite0 碰撞。或者说,如果一个物体与另一个碰撞,那么另一个也肯定与这个物体发生碰撞。所以可以排除两次重复判断。如果删掉重复判断,列表内容应该是这样的:
sprite0 与 sprite1, sprite2, sprite3, sprite4, sprite5 进行比较
sprite1 与 sprite2, sprite3, sprite4, sprite5 进行比较
sprite2 与 sprite3, sprite4, sprite5 进行比较
sprite3 与 sprite4, sprite5 进行比较
sprite4 与 sprite5 进行比较
sprite5 没有可比较的对象!
代码如下:
numSprites = 6;
for (i = 0; i < numSprites - 1; i++)
{
spriteA = sprites[i];
for (j = i + 1; j < numSprites; j++)
{
spriteB = sprites[j]; if (spriteA.hitTestObject(spriteB))
{ // do whatever }
}
}