畫布游戲：碰撞檢測

Question

為了我的教育，我必須使用HTML5畫布制作一個基本的游戲。 該游戲是射擊游戲。 當您可以向左移動->向右時，就可以拍攝空間了。 當我射擊時，子彈會向上移動。 敵人下山。 當子彈擊中敵人時，敵人必須消失，它將獲得+1分。 但是敵人將在屏幕上消失。

演示： http ： //jordikroon.nl/test.html

空間=射擊+敵人出現

這是我的代碼：

            for (i=0;i<enemyX.length;i++) {

                if(enemyX[i] > canvas.height) {

                    enemyY.splice(i,1);
                    enemyX.splice(i,1);
                 } else {

                    enemyY[i] += 5;
                    moveEnemy(enemyX[i],enemyY[i]);

                 }
            }

            for (i=0;i<bulletX.length;i++) {

                if(bulletY[i] < 0) {
                    bulletY.splice(i,1);
                    bulletX.splice(i,1);
                 } else {

                    bulletY[i] -= 5;
                    moveBullet(bulletX[i],bulletY[i]);

                    for (ib=0;ib<enemyX.length;ib++) {

                      if(bulletX[i] + 50 < enemyX[ib] ||
                              enemyX[ib] + 50 < bulletX[i] ||
                               bulletY[i] + 50 < enemyY[ib] ||
                               enemyY[ib] + 50 < bulletY[i]) 
                        {   
                            ++score;
                            enemyY.splice(i,1);
                            enemyX.splice(i,1);
                        }
                    }   
                 }
            }

對象：

        function moveBullet(posX,posY) {
            //console.log(posY);
            ctx.arc(posX, (posY-150), 10, 0 , 2 * Math.PI, false);

        }

        function moveEnemy(posX,posY) {

            ctx.rect(posX, posY, 50, 50);
            ctx.fillStyle = '#ffffff';
            ctx.fill(); 
        }

Answer 1

ORI認為我遇到了問題。 您的碰撞檢測有以下代碼

                  if(bulletX[i] + 50 < enemyX[ib] ||
                          enemyX[ib] + 50 < bulletX[i] ||
                           bulletY[i] + 50 < enemyY[ib] ||
                           enemyY[ib] + 50 < bulletY[i]) 

這是直的ORs（||），+ 50在小於一側。 這意味着，只要子彈不在命中框中，它實際上應該觸發為true。 我懷疑您想讓+50大於邊，而讓ORs（||）為ANDs（&&）。

Answer 2

根據Ben的修正，最好做一個線-線碰撞檢測，而不是點盒式碰撞檢測，以供將來參考。

原因是，假設您的敵人很小，子彈移動很快。 子彈總是有可能在一幀中出現在敵人之前，然后在下一幀中出現在敵人之后，因此永遠不會被擊中。

測試與子彈路徑的交點以及敵人的假想線將更加准確。