最终停止弹跳球

时间:2016-02-24 00:37:59

标签: javascript html5 canvas

创建一个简单的HTML5 Canvas程序,其中有一个balls数组,每个都以自己的速度移动并反弹到画布的“墙”。我还通过添加球的vy并将vxvy分别乘以一小部分来增加重力和摩擦力。

对于bounce,我使用的值为-0.7,因此球在每次反弹时都会失去一些能量,但问题是......它永远不会完全“停止”。它在地图底部进行了一种“浮动”运动。 Fiddle

以下是检查边界的代码......

checkBounds(ball, map, -0.7);

(注意:checkBounds在utils.js中定义)

function checkBounds(obj, map, bounce) {
  bounce = bounce || -1;
  var offset = {
    x: obj.width / 2 || obj.radius,
    y: obj.height / 2 || obj.radius
  };
  var bounds = {
    left: map.left || 0,
    right: map.right || map.width || innerWidth,
    top: map.top || 0,
    bottom: map.bottom || map.height || innerHeight
  }
  if (obj.x - offset.x < bounds.left) {
    obj.x = offset.x;
    obj.vx *= bounce;
  } else if (obj.x + offset.x > bounds.right) {
    obj.x = bounds.right - offset.x;
    obj.vx *= bounce;
  }
  if (obj.y - offset.y < bounds.top) {
    obj.y = offset.y;
    obj.vy *= bounce;
  } else if (obj.y + offset.y > bounds.bottom) {
    obj.y = bounds.bottom - offset.y;
    obj.vy *= bounce;
  }
  return obj;
}

如何在某个时候让球轻松停下来?

0 个答案:

没有答案