Stoppt Spielerbewegung nach Kollisionserkennung In Canvas

Question

Ich habe im Grunde zwei Wände in der Leinwand gemacht. Eins oben und eins unten. Mein Player wird von der Maus gesteuert und ich wollte wissen, wie man den Player nicht durch die Wände gehen lassen.

Hier ist die Funktion für die allgemeine Kollision zwischen zwei Objekten:

function collides(a, b) { 
    var val = false; 

    val = (a.x < b.x + b.width) && 
    (a.x + a.width > b.x) && 
    (a.y < b.y + b.height) && 
    (a.y + a.height > b.y); 

    return val;   
} 

Hier ist der Code, der Kollisionserkennung erkennt:

if (collides(player, block)){ 
    //I don't know what goes here. 
} 

Jede Hilfe würde geschätzt.

Answer 1

Positionieren Sie den Player wie bereits beschrieben und auch klemmen Sie die Position des Players y immer zwischen der oberen und unteren Wand.

// reposition the player as you already do 
... 

// and clamp the player to stay below the top wall 
if(player.y < wall.y+wall.height){ player.y = wall.y+wall.height); 

// and clamp the player to stay above the bottom wall 
if(player.y+player.height > wall.y){ player.y = wall.y-player.height);