碰撞“毛茸茸”,如果你愿意的话,在画布中

时间:2012-07-09 05:37:25

标签: javascript html5-canvas

有一个弧线可以检测到底部物体的位置。这个弧形或球形弹跳很好,直到第二次弹跳,并在地板上出现故障。变量ball.gSy控制球落下的速度。现在它乘以10(ball.y += 10*ball.gSy;)来加速地板中的毛刺效应。此外,你可以使用箭头键控制球,它确实卡在侧壁,但底层问题是我特别好奇的。

这是一个更好地满足您的赞助的jsfiddle链接: http://jsfiddle.net/nhQtk/

1 个答案:

答案 0 :(得分:1)

你的问题是你将球向下移动,但是当发生碰撞时,你不会将球移回到一个没有被卡在地板上的位置。

所以你正确地发现了碰撞,但是你的球已经部分穿过墙壁并且无法向后移动。

这里概括了你需要做什么:

 ball.y += 10*ball.gSy;
 for(var i = 0; i < objects.length; i++){
                        if(ball.x > objects[i].x - ball.r &&
                          ball.y > objects[i].y - ball.r && 
                          ball.x < ball.r + objects[i].x + objects[i].w &&
                          ball.y < ball.r + objects[i].y + objects[i].h)
                      {
                            ball.gSy = (-1 * ball.gSy);
                            ball.y -= 10;// <--- important step
                            // You need to calculate how much to move the ball BACK up to where it has not quite hit the floor.   

                       }