如何在 p5.js 中使用箭头键移动 Matter.js 主体？

Question

我目前正在尝试用 JavaScript 为一个学校项目制作一个 2d 坦克游戏并处理我使用物理库 matter.js 以及 p5.js 进行渲染的物理。

到目前为止，我有一个基本的画布，在墙壁和地板上都有边界，这样物体就不会离开屏幕，但是，下一个任务是能够将一个盒子（稍后将是一个坦克）向左移动和右箭头键。我之前在纯 JS 中做过类似的事情，只需使用事件侦听器来判断何时按下左箭头键或右箭头键，然后将对象向左或向右重绘 5 个像素。然而，这种方法在 Matter.js 中并没有奏效，这让我非常困惑。

这里是 draw() 函数，我目前正在尝试用不同的方法来解决这个问题：

function draw() {
    background(51);
    Engine.update(engine);
    for (var i = 0; i < boxes.length; i++) {
        boxes[i].show();
    }
     if(rightPressed) {
         box1.position.x += 7
     }
    if(leftPressed) {
        Body.applyForce(box1, {x: box1.position.x, y: box1.position.y}, {x: 0.05, y: 0});
    }
    for (var i = 0; i < boundaries.length; i++) {
      boundaries[i].show();
    }
    for (var i = 0; i < circles.length; i++) {
        circles[i].show();
        if (circles[i].isOffScreen()) {
            circles[i].removeFromWorld();
            circles.splice(i, 1)
            i--;
        }
    }
}

setInterval(draw, 10)

非常感谢任何帮助。

Answer 1

使用 keyIsDown() 函数检查特定的键输入。 一个例子是：

draw(){

   if(keyIsDown(LEFT_ARROW)){
      //code xyz
     }

}