打砖块游戏中 怎么判断小球与方块撞击后运动的方向呢?

正在用JavaScript+Canvas实现一个打砖块游戏,碰撞算法参考的实现思路是https://www.zhihu.com/questio...

现在的问题是检测到小球与矩形方块碰撞后 怎么判断小球接下来的运动方向?
我认为这里有两种情况 第一种是从上下左右四个边撞击 然后让小球一个方向(比如x轴)上的速度值不变 让另一个方向(比如y轴)的速度取负数 这样小球就有一个反弹的效果了(类似于镜面反弹)
第二种情况我觉得应该是从四个角撞击 这个时候就应该把两个方向的速度都取负值 小球就会向运动来的方向“弹回去”

第一种情况很好实现,,关键是第二种情况该怎么判断呢? 我不知道该用什么来判断小球是否是撞击的四个角

如果思路不对 请指正。。

/2017-8-10更新/
利用我在评论里发现的那种夹角的办法把判断边和角撞击实现了。。但是新的问题是 我是在移动小球位置之后才判断是否碰撞的 有的时候会出现小球的位置已经在砖块里面去了 才去判断撞击 这样就会形成死循环在小球在砖块内不停运动的鬼畜效果。。。然后我查到一个叫“分离轴定理”的算法,,貌似可以判断这个“最小平移量”
http://blog.mn886.net/chenjia...
http://web.jobbole.com/90472/
但是这两个链接里的代码看不太懂。。有大神能简单用js写写利用分离轴定理来实现矩形与圆碰撞的算法么。。包括碰撞以后反弹的效果(也就是沿着最小平移量的反方向)

阅读 3.9k
评论
    5 个回答

    我最近也在做这个游戏,遇见的最难的bug也就是:小球在砖块内不停运动的鬼畜效果,这个问题其实和用到算法没有关系。后来我在一个开源的打砖块游戏的源码里找到了解决办法,这里简单叙述下:小球和砖块碰撞之后,速度是要取反的,所以没碰撞之前,小球中心和砖块中心的距离,一定是大于下一次小球中心和砖块中心的距离的,而下一次小球的中心坐标是通过当前坐标 + 速度计算出来的。文字描述不太容易理解,看代码:

    if(collision) { // 检测到碰撞
      var ballCenter = ball.y + ball.height / 2;    // 小球的中心的垂直坐标
      var brickCenter = brick.y + brick.height / 2; // 砖块的中心的垂直坐标
     
      // 小球向着砖块运动,速度取反
      if ((ballCenter - brickCenter ) > (ballCenter + speedY - brickCenter )) {
        ball.speedY *= -1;
      } else { // 小球背着砖块运动,这时候仍有可能检测到小球和砖块碰撞,
               // 如果仍取反速度,就会出现小球卡进砖块的鬼畜bug
        ball.speedY *= 1;
      }
    }

    总的来说就是,检测到碰撞之后,再检测小球的运动趋势是远离砖块还是靠近砖块,如果是靠近就反向速度,如果是远离,速度方向就不变。

    原来小球会进入砖块的 bug 就是因为在检测到碰撞之后,直接反向速度,这样当运动较快时,就会发生“像素穿透”,也就是说,速度反向后,小球有可能仍与砖块有重叠的部分,这样速度还会再次反向,最终就造成了小球在砖块内不停运动的鬼畜效果。

      • 9k

      碰撞时 |h| + |r| == |v| 不就是碰到角了

        • 6.7k

        得到最短距离矢量后可以进一步得到 "碰撞点",即 矢量p - 矢量u 得到的点。在角上碰撞的时候,这个碰撞点也应该在矩形的角上。

        另外 "小球就会向运动来的方向弹回去" 这个和生活经验是不一致的,可以试试朝桌脚滚一个球看看。你可能需要再想一下球的受力和运动情况。

          给你的砖块加一个AABB包围,实际在游戏开发中,不会真正按照物理定律来实现。简单的办法,你可以给你的砖块加一个圆形,或是矩形的检测范围,其半径大于你真正的砖块,这样就不会出现小球欠入砖块了。

          这种小游戏,是否遵循物理是其次的,快速开发,效果好才是第一的。

            建议先玩玩星际弹球游戏。

              撰写回答

              登录后参与交流、获取后续更新提醒

              相似问题
              推荐文章