笔记：弹性运动

 

弹性运动的加速度与物体到目标点的距离成正比例。

一维坐标上的弹性运动 这里我们仍然使用可以拖拽的小球作为主体。默认位置还是 x 轴的 0 点，使它具有运动到中心点的弹性。像使用缓动一样，需要一个变量保存弹性的数值。可以认为这个数同距离的比例，较大的弹性值会使弹性运动显得十分僵硬。较小的弹性值会使弹性运动像一条松紧带。我们选用 0.1 作为弹性 (spring) ：

private var spring:Number = 0.1;

private var targetX:Number = stage.stageWidth / 2;

private var vx:Number = 0;
不要担心物体当前的位置，只需要知道如何确定这些变量与表达式就可以了。 然后加入运动代码并且找出与目标点的距离：

var dx:Number = targetX - ball.x;
下面计算加速度。加速度与距离成正比，也就是距离乘以 spring 的值：

var ax:Number = dx * spring;
得到了加速度以后，我们就回到了熟悉的地方，把加速度加到速度向量中。

vx += ax;

ball.x += vx;

试验一下，可以看出一个类似于弹簧的效果，唯一的问题是它永远不会停止。前面在描述弹性运动时说过“速度逐渐慢下来直到停止”。由于小球每次摇摆时的距离相同，所以速度向量也相同，这样它就会以同样的速度来回摆动。这时，我们需要引入摩擦力。非常简单——只需要一个 friction 变量，值为 0.95。放在类开始的地方作为成员变量：

private var friction:Number = 0.95;

在 enterFrame 函数中，每次将 vx 乘以 friction，就可以了。

package 
{
	import flash.display.Sprite;
	import flash.events.Event;
	public class Spring extends Sprite
	{
		private var ball:Ball;
		private var spring:Number = 0.1;
		private var vx:Number = 0;
		private var vy:Number = 0;
		private var friction:Number = 0.95;
		private var gravity:Number = 5;
		public function Spring()
		{
			init();
		}
		private function init():void
		{
			ball = new Ball();
			addChild(ball);
			addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
		private function onEnterFrame(event:Event):void
		{
			var dx:Number = mouseX - ball.x;
			var dy:Number = mouseY - ball.y;
			var ax:Number = dx * spring;
			var ay:Number = dy * spring;
			vx +=  ax;
			vy +=  ay;
			vy +=  gravity;
			vx *=  friction;
			vy *=  friction;
			ball.x +=  vx;
			ball.y +=  vy;
			graphics.clear();
			graphics.lineStyle(1);
			graphics.moveTo(ball.x, ball.y);
			graphics.lineTo(mouseX, mouseY);
		}
	}
}