我在这个项目上遇到了麻烦。我是很新的，我不知道为什么这段代码不能正常工作。网格中有一个点(你，玩家)，如果某些情况发生，它会被转移到另一个位置。在这里，如果dir等于1或2(向右或向下)，玩家将完全朝那个方向移动。
图片:这是精灵应该如何移动
图片:它是这样移动的
这是p5网络编辑器的链接:https://editor.p5js.org/MarcoGaLo/full/cU2K72dRZ
下面这段代码不起作用:
//dir is 0 when up arrow is pressed, 1 with right arrow, 2 down, 3 for left
move() {
if (dir == 0 && !grid[this.i][this.j - 1].wall) {
if (grid[this.i][this.j - 1].box) {
if (!grid[this.i][this.j - 2].wall && !grid[this.i][this.j - 2].box) {
this.player = false;
grid[this.i][this.j - 1].player = true;
grid[this.i][this.j - 2].box = true;
grid[this.i][this.j - 1].box = false;
}
} else {
this.player = false;
grid[this.i][this.j - 1].player = true;
}
}
if (dir == 1 && !grid[this.i + 1][this.j].wall) {
if (grid[this.i + 1][this.j].box) {
if (!grid[this.i + 2][this.j].wall && !grid[this.i + 2][this.j].box) {
this.player = false;
grid[this.i + 1][this.j].player = true;
grid[this.i + 2][this.j].box = true;
grid[this.i + 1][this.j].box = false;
}
} else {
this.player = false;
grid[this.i + 1][this.j].player = true;
}
}
if (dir == 2 && !grid[this.i][this.j + 1].wall) {
if (grid[this.i][this.j + 1].box) {
if (!grid[this.i][this.j + 2].wall && !grid[this.i][this.j + 2].box) {
this.player = false;
grid[this.i][this.j + 1].player = true;
grid[this.i][this.j + 2].box = true;
grid[this.i][this.j + 1].box = false;
}
} else {
this.player = false;
grid[this.i][this.j + 1].player = true;
}
}
if (dir == 3 && !grid[this.i - 1][this.j].wall) {
if (grid[this.i - 1][this.j].box) {
if (!grid[this.i - 2][this.j].wall && !grid[this.i - 2][this.j].box) {
this.player = false;
grid[this.i - 1][this.j].player = true;
grid[this.i - 2][this.j].box = true;
grid[this.i - 1][this.j].box = false;
}
} else {
this.player = false;
grid[this.i - 1][this.j].player = true;
}
}
}
问题在于，当你遍历所有网格方块以找到玩家单元格时，你一直在迭代寻找玩家。所以玩家被找到并移动，然后你搜索下一个有玩家的区域，所以再次移动它(直到它到达墙壁)。修复只是在按下的函数中添加一个返回语句。我将在这里添加一个可操作的代码块。
let grid = [];
var player;
var w = 40;
var dir,
nivel = 1;
let up, down, right, left;
function setup() {
createCanvas(400, 400);
for (var i = 0; i < width / w; i++) {
grid[i] = [];
for (var j = 0; j < height / w; j++) {
grid[i][j] = new Cell(i * w, j * w, i, j);
}
}
up = createButton("⬆");
up.position(70, height + 10);
down = createButton("⬇");
down.position(70, height + 70);
right = createButton("➡");
right.position(130, height + 40);
left = createButton("⬅");
left.position(10, height + 40);
reset = createButton("RESET")
reset.position(260, height + 40)
level(nivel);
}
function draw() {
background(220);
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
grid[i][j].show();
}
}
up.mousePressed(botonUp);
down.mousePressed(botonDown);
right.mousePressed(botonRight);
left.mousePressed(botonLeft);
reset.mousePressed(resetear)
}
function resetear() {
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
grid[i][j].reset();
}
}
}
function botonUp() {
dir = 0;
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
if (grid[i][j].player) {
grid[i][j].move();
}
}
}
}
function botonRight() {
dir = 1;
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
if (grid[i][j].player) {
grid[i][j].move();
}
}
}
}
function botonDown() {
dir = 2;
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
if (grid[i][j].player) {
grid[i][j].move();
}
}
}
}
function botonLeft() {
dir = 3;
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
if (grid[i][j].player) {
grid[i][j].move();
}
}
}
}
function keyPressed() {
for (var i = 0; i < width / w; i++) {
for (var j = 0; j < height / w; j++) {
if (keyCode == 82) {
resetear();
}
if (grid[i][j].player) {
if (keyCode === UP_ARROW) {
dir = 0;
}
if (keyCode === RIGHT_ARROW) {
dir = 1;
}
if (keyCode === DOWN_ARROW) {
dir = 2;
}
if (keyCode === LEFT_ARROW) {
dir = 3;
}
grid[i][j].move();
return;
}
}
}
}
function level(n) {
for (var i = 0; i < width / w; i++) {
grid[0][i].wall = true;
grid[width / w - 1][i].wall = true;
}
for (var j = 0; j < height / w; j++) {
grid[j][0].wall = true;
grid[j][height / w - 1].wall = true;
}
if (n == 1) {
grid[4][4].caja = true;
grid[4][7].player = true;
grid[2][4].wall = true;
grid[3][5].wall = true;
grid[7][6].spot = true;
} else if (n == 2) {
}
}
class Cell {
constructor(x, y, i, j) {
this.x = x;
this.y = y;
this.i = i;
this.j = j;
this.w = w;
this.caja = false;
this.player = false;
this.wall = false;
this.spot = false;
this.time = 0;
}
show() {
if (this.caja) {
fill("brown");
stroke(57, 0, 8);
strokeWeight(3);
rect(this.x + 2.5, this.y + 2.5, w - 5, w - 5);
line(this.x + 2.5, this.y + 2.5, this.x + w - 2.5, this.y + w - 2.5);
line(this.x + w - 2.5, this.y + 2.5, this.x + 2.5, this.y + w - 2.5);
} else {
fill(255);
strokeWeight(1);
stroke(0, 50);
rect(this.x, this.y, w, w);
}
if (this.player) {
ellipseMode(CORNER);
fill(0);
circle(this.x + 3, this.y + 3, w - 6);
} else if (this.spot) {
if (this.time % 45 > 15) {
fill(104, 252, 3);
noStroke();
circle(this.x + 2, this.y + 2, w - 4);
}
} else if (this.wall) {
fill(130);
rect(this.x, this.y, w, w);
}
if (this.caja && this.spot) nivel++;
this.time++;
if (this.time == 4500) {
this.time = 0;
}
}
move() {
if (dir == 0 && !grid[this.i][this.j - 1].wall) {
if (grid[this.i][this.j - 1].caja) {
if (!grid[this.i][this.j - 2].wall && !grid[this.i][this.j - 2].caja) {
this.player = false;
grid[this.i][this.j - 1].player = true;
grid[this.i][this.j - 2].caja = true;
grid[this.i][this.j - 1].caja = false;
}
} else {
this.player = false;
grid[this.i][this.j - 1].player = true;
}
}
if (dir == 1 && !grid[this.i + 1][this.j].wall) {
if (grid[this.i + 1][this.j].caja) {
if (!grid[this.i + 2][this.j].wall && !grid[this.i + 2][this.j].caja) {
this.player = false;
grid[this.i + 1][this.j].player = true;
grid[this.i + 2][this.j].caja = true;
grid[this.i + 1][this.j].caja = false;
}
} else {
this.player = false;
grid[this.i + 1][this.j].player = true;
}
}
if (dir == 2 && !grid[this.i][this.j + 1].wall) {
if (grid[this.i][this.j + 1].caja) {
if (!grid[this.i][this.j + 2].wall && !grid[this.i][this.j + 2].caja) {
this.player = false;
grid[this.i][this.j + 1].player = true;
grid[this.i][this.j + 2].caja = true;
grid[this.i][this.j + 1].caja = false;
}
} else {
this.player = false;
grid[this.i][this.j + 1].player = true;
}
}
if (dir == 3 && !grid[this.i - 1][this.j].wall) {
if (grid[this.i - 1][this.j].caja) {
if (!grid[this.i - 2][this.j].wall && !grid[this.i - 2][this.j].caja) {
this.player = false;
grid[this.i - 1][this.j].player = true;
grid[this.i - 2][this.j].caja = true;
grid[this.i - 1][this.j].caja = false;
}
} else {
this.player = false;
grid[this.i - 1][this.j].player = true;
}
}
}
reset() {
this.caja = false;
this.player = false;
this.wall = false;
this.spot = false;
this.time = 0;
level(nivel);
}
}<script src="https://cdn.jsdelivr.net/npm/p5@1.4.1/lib/p5.js"></script>我还开始了一个新的移动函数，这是真正简化:
move() {
let m = 0;
switch(dir){
case 0: m = -1; break;
case 1: m = 1; break;
case 2: m = 1; break;
case 3: m = -1; break;
default: throw new Error("dir not 0 - 3");
}
let d = (dir == 0 || dir == 2);
if (!grid[this.i + !d * m][this.j + d * m].wall) {
if (grid[this.i + !d * m][this.j + d * m].box) {
if (!grid[this.i + !d * m * 2][this.j + d * m * 2].wall && !grid[this.i + !d * m * 2][this.j + d * m * 2].box) {
this.player = false;
grid[this.i + !d * m][this.j + d * m].player = true;
grid[this.i + !d * m * 2][this.j + d * m * 2].box = true;
grid[this.i + !d * m][this.j + d * m].box = false;
}
} else {
this.player = false;
grid[this.i + !d * m][this.j + d * m].player = true;
}
}
}
虽然我不能让盒子碰撞工作。我不太明白它(在代码中)应该是如何工作的。