时间戳

首页 > 解决方案 > Javascript 碰撞检测生成的分数超过了应有的分数

javascript - Javascript 碰撞检测生成的分数超过了应有的分数

问题描述

我正在创建一个简单的 javascript 游戏，其中桨需要捕捉下雨的积木。当发生碰撞时，分数应该增加 1，但在我的情况下，分数会增加 12。

我很确定有碰撞检测，因为当它碰到桨时，块会消失，我有一个 console.log 来告诉我有碰撞。

我的碰撞检测代码

var spawnRate = 1500;
    var spawnRateOfDescent = 2;
    var lastSpawn = -10;
    var objects = [];
    var startTime = Date.now();
    var score =0;

    function spawnRandomObject() {
    
        var t;

        if (Math.random() < 0.50) 
        {
            t = "red";
        } 
        else 
        {
            t = "blue";
        }
   
        var object = {      
            type: t, 
            x: Math.random() * (canvas.width - 30) + 15,
            y: 100,
            r: 8,
            status: 1 
        }
         
       objects.push(object);
    }


    function animate() 
    {
        var time = Date.now();    
        if (time > (lastSpawn + spawnRate)) {
            lastSpawn = time;
            spawnRandomObject();
        }

        var paddleLeft=paddleX;
        var paddleRight=paddleX+paddleWidth;
        var paddleTop=paddleY;
        var paddleBottom=paddleY+paddleHeight;
      
        for (var i = 0; i < objects.length; i++) 
        {

            var object = objects[i];
            object.y += spawnRateOfDescent;

            if (object.status == 1){ //only draw the ball if the status is 1
            ctx.beginPath();
            ctx.arc(object.x, object.y, object.r, 0, Math.PI * 2);
            ctx.closePath();
            ctx.fillStyle = object.type;
            ctx.fill();
            }

            var objectTop=object.y-object.r;
            var objectBottom=object.y+object.r;
            var objectLeft=object.x-object.r;
            var objectRight=object.x+object.r;

            
            if (objectRight>paddleX && objectLeft<paddleX+paddleWidth && objectBottom>paddleY && objectTop<paddleY+paddleHeight)
            {
                object.status = 0; 
                console.log("collision");
                score = score +1;
            }
        }
    }

标签： javascriptcollision-detection

解决方案

在以下代码中，您将添加分数：

            if (objectRight>paddleX && objectLeft<paddleX+paddleWidth && objectBottom>paddleY && objectTop<paddleY+paddleHeight)
            {
                object.status = 0; 
                console.log("collision");
                score = score +1;
            }

我看到您将status对象的 设置为 0。您可以在以下情况下使用它：

            if (objectRight>paddleX && objectLeft<paddleX+paddleWidth && objectBottom>paddleY && objectTop<paddleY+paddleHeight && object.status === 1)
            {
                object.status = 0; 
                console.log("collision");
                score++;
            }

请记住，您不会从数组中删除对象。

推荐阅读