如何在 p5js 中使用方向键跳转对象？

Question

这是我试过的代码。当我按下 "up arrow key" 或 "space bar" 时，球在跳。问题是当球 jumped.Can 时，我无法将球向前移动一点点，有人帮我吗？

let jumper;

function setup() {
    createCanvas(400, 400);
    jumper = new Jumper();
}

function draw() {
    clear();
    jumper.run();

    push();
    fill(217);
    textFont('Avenir');
    textAlign(CENTER,CENTER);
    textSize(33);
    text('space bar to jump', width>>1, height*0.15);
    pop();
}

function keyPressed() {
    jumper.vel.y = -4;
    jumper.vel.x=+5;
}

Answer 1

您需要删除倒数第二行中的错误。

jumper.vel.x += 5;

Answer 2

我建立了一个非常基本的示例，说明我认为您可能正在努力实现的目标：

let jumper;

function setup() {
    createCanvas(400, 400);
    jumper = new Jumper();
}

function draw() {
    clear();
    jumper.run();
 
    push();
    fill(217);
    textFont('Avenir');
    textAlign(CENTER,CENTER);
    textSize(33);
    text('space bar to jump', width>>1, height*0.15);
    pop();
}

function keyPressed() {
    jumper.x+=5;
}

class Jumper {
  
  constructor() {
    this.x = 10;
    this.y = height/2;
  }
  
  run() {
    ellipse(this.x, this.y, 10, 10);
  }

}

<script src="https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js"></script>

@Dishant 是正确的，因为你的代码在你做 jumper.vel.x =+ 5 的地方有错字，这基本上只是将跳线的位置设置为 5 的 x 位置。当你想要的是实际制作跳线向前移动 5 个像素 - 在我的示例中，这是使用 jumper.x += 5 完成的，但您当然会使用 jumper.vel.x += 5，因为您的问题中未显示该代码！

如何在 p5js 中使用方向键跳转对象？

How to jump object using arrow key in p5js?

javascript

p5.js