微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

为什么我的玩家要与整个 y 板块碰撞,而不仅仅是与 y 板块 258 和 282 碰撞?

如何解决为什么我的玩家要与整个 y 板块碰撞,而不仅仅是与 y 板块 258 和 282 碰撞?

我开始在 Javascript 上进行碰撞,并且它们正在工作,问题是我认为我的播放器没有与瓷砖碰撞。他正在与我对碰撞函数所做的整个 x 和 y 碰撞。 我在运行整个瓦片地图阵列的 cicle "for" 之后使用 switch/case。 每个案例代表一个瓷砖...但我不太确定。

这是我的代码 + 绘制地图代码 + 玩家属性。如果有人可以帮助我,那就太好了!

Colision log true when there is no 282 tile

var cols = 25;
var rows = 18;
var tileWidth = 32;
var tileHeight = 32;
var tileX = 0;
var tileY = 0;
var solid = false;
canvas.width = cols * tileWidth;
canvas.height = rows * tileHeight;
var map = [
    467,468,467,499,500,501,282,258,528,528
];

Math.floor()

var map467 = new Image();
map467.src = "467_tile.png"
var map468 = new Image();
map468.src = "468_tile.png"
var map499 = new Image();
map499.src = "499_tile.png"
var map500 = new Image();
map500.src = "500_tile.png"
var map501 = new Image();
map501.src = "501_tile.png"
var map528 = new Image();
map528.src = "528_tile.png"
var map258 = new Image();
map258.src = "258_tile.png"
var map282 = new Image();
map282.src = "282_tile.png"



var keys = [];
var player = {
    x: 400,y: 439,width: 48,height: 48,frameX: 0,frameY: 1,speed: 3,moving: false,movingLeft: false,movingRight: false,jump: false,jumpSpeed:12,jumpLeft: false,jumpRight: false,gravity: 0.7,jumpY: 500,velY: 0,ground: true,groundY: 552,direction: 0,facing: 'right',shot:false
};

 function drawMap() {
    for (var y = 0; y < rows; y++){
        for (var x = 0; x<cols; x++) {
            switch (map[((y*cols)+x)]){
                case 467:
                    ctx.drawImage(map467,x*tileWidth,y*tileHeight,tileWidth,tileHeight);
                    break;
                case 468:
                    ctx.drawImage(map468,tileHeight);
                    break;

                case 499:
                    ctx.drawImage(map499,tileHeight);
                    break;
                case 500:
                    ctx.drawImage(map500,tileHeight);
                    break;
                case 501:
                    ctx.drawImage(map501,tileHeight);
                    break;
                case 528:
                    ctx.drawImage(map528,tileHeight);
                    break;
                case 282:
                    ctx.drawImage(map282,tileHeight);
                    solid = true;
                    break;
                case 258:
                    ctx.drawImage(map258,tileHeight);
                    solid =true;
                    break;
            }
        }
    }
}


    function colisionLeft(x,y){
    if((player.x) >= x*tileWidth && (player.x) <= ((x*tileWidth) + tileWidth)){
        if((((player.y + 24) >= (y*tileWidth)) && ((player.y + 24) <= (y*tileWidth + tileHeight))))  {
            return true;
        }
    }
    return false;
}

function colisionRight(x,y){
    if(((player.x + player.width) >= x*tileWidth) && ((player.x + player.width) <= ((x*tileWidth) + tileWidth))){
        if((((player.y + 24) >= (y*tileWidth)) && ((player.y + 24) <= (y*tileWidth + tileHeight))))  {
            return true;
        }
    }
    return false;
}

function colisionBottom(x,y){
    if((player.y  + player.height) >= (y*tileHeight) && ((player.y + player.height) >= ((y*tileHeight) + tileHeight))) {
        if ((((player.y+ 10 ) >= (y * tileWidth)) && ((player.y+ 10 ) <= (y * tileWidth + tileHeight)))) {
            return true;
        }
    }
    return false;
}

function colisionTop(x,y){
    if(((player.y) <= (y*tileHeight + tileHeight))){
        if((((player.y) >= (y*tileWidth)) && ((player.y ) <= (y*tileWidth + tileHeight))))  {
            return true;
        }
    }
    return false;
}


function movePlayer() {
    // console.log('map');
    // console.log(map);
    //Left
    if (keys[37] && player.x > 0) {
        player.frameY = 2;
        player.movingLeft = true;
        player.movingRight = false;
        player.direction =0
        player.facing = "left"

        var erro = false;
        var bot = false
        for (var y = 0; y < rows; y++){
            for (var x = 0; x<cols; x++) {
                switch (map[((y*cols)+x)]){
                    case 258:
                        if(colisionLeft(x,y) == true){
                            erro = true;
                            console.log("colision left");

                        }
                        break;

                }
            }
        }
        if(erro == false){
            player.x -= player.speed;

        }



    }
    //Right
    if (keys[39] && player.x < canvas.width - player.width) {
        // console.log('right');

        player.frameY = 3;
        player.movingRight = true
        player.movingLeft = false
        player.direction = 1;
        player.facing = "right";

        var erro = false;
        for (var y = 0; y < rows; y++){
            for (var x = 0; x<cols; x++) {
                switch (map[((y*cols)+x)]){
                    case 258:

                        if(colisionRight(x,y) == true){
                            erro = true;
                            console.log("colision right");

                        }
                        break;
                }
            }
        }
        if(erro == false){
            player.x += player.speed;

        }
    }
    // UP
    if (keys[38]) {
        console.log('up');
        player.jump = true;
        player.ground = false;
        player.y -= player.jumpSpeed;
        player.frameY = 5;
        var top= false;
        var bot = false;
        for (var y = 0; y < rows; y++){
            for (var x = 0; x<cols; x++) {
                switch (map[((y*cols)+x)]){
                    case 258:
                        if(colisionBottom(x,y) == true){
                            bot = true;
                        }
                        break;

                    case 282:
                        if (colisionTop(x,y) == true){
                            top = true;

                            player.jump = false

                            console.log("colision top")
                        }
                        break;

                }
            }
        }

        if(bot == false){
            player.velY -= player.gravity;
        }
        if(top == false){
            

            player.velY -= player.gravity;



        }
    }

    // JUMP + GraviTY (BOUNCE EFFECT)
    if (player.jump === true) {
        console.log("1111");
        player.velY += player.gravity
        player.y += player.velY
        if (player.y >= canvas.height - player.height && player.jump === true) {
            player.y = canvas.height - player.height
            player.velY = 0
            player.jump = false;
        }
    }

    if(player.ground === false){
        var top = false;
        var bot = false;
        for (var y = 0; y < rows; y++){
            for (var x = 0; x<cols; x++) {
                switch (map[((y*cols)+x)]){
                    case 258:
                        if(colisionBottom(x,y) == true){
                            bot = true;
                            //player.y = y - player.height
                            player.velY = 0
                            player.jump = false;
                            player.ground = true

                        }
                        break;

                }
            }
        }
        if(bot === false) {
              player.velY += player.gravity
            player.ground = false;


        }
       // if(top === false) {
       //     player.velY += player.gravity}
        // if(bot == false){
        //     player.velY += player.gravity
        //     player.y += player.velY
        // }
                    
    }

}

--------------------- 没有 () 的碰撞代码现在是最糟糕的 :( ---------------- —— 函数colisionLeft(x,y){ if(player.x >= xtileWidth && player.x tileWidth) + tileWidth)){ if((player.y + 24) >= (ytileWidth) && (player.y + 24) tileWidth) + tileHeight)) { 返回真; } } 返回假; }

function colisionRight(x,y){
    if((player.x + player.width) >= (x*tileWidth) && (player.x + player.width) <= ((x*tileWidth) + tileWidth)){
        if((player.y + 24) >= (y*tileWidth) && (player.y + 24) <= ((y*tileWidth) + tileHeight))  {
            return true;
        }
    }
    return false;
}

function colisionBottom(x,y){
    if((player.y  + player.height) >= (y*tileHeight) && (player.y + player.height) >= ((y*tileHeight) + tileHeight)) {
        if ((player.y+ 10 ) >= (y * tileWidth) && (player.y+ 10 ) <= ((y * tileWidth) + tileHeight)) {
            return true;
        }
    }
    return false;
}

function colisionTop(x,y){
    if(player.y <= ((y*tileHeight) + tileHeight)){
        if(player.y >= (y*tileWidth) && player.y  <= ((y*tileWidth) + tileHeight))  {
            return true;
        }
    }
    return false;
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。