按下键时图像不会转换

时间:2017-11-10 17:02:16

标签: javascript p5.js

想要在屏幕上移动图像。此时图像呈现但在按下特定键时不翻译页面。无法看到让它发挥作用 - 任何建议?我包含了整个代码块,因为我认为它更有意义。

var player;
var img;

function preload() {
    img = loadImage("charcter.png");
}

function setup() {
  background(255, 0, 0, 0.4);
  createCanvas(1000, 600);
  player = new Astro(0,0);
}

function draw() {
   // clear();
    player.show();
    player.update();
}

function keyPressed() {
  if (keyCode === UP_ARROW) {
    player.dir(0, -10);
  } else if (keyCode === DOWN_ARROW) {
    player.dir(0, 10);
  } else if (keyCode === RIGHT_ARROW) {
    player.dir(10, 0);
  } else if (keyCode === LEFT_ARROW) {
    player.dir(-10, 0);
  }
}

function Astro(x, y) {
    this.x = x;
    this.y = y;
    this.xSpeed = 0;
    this.ySpeed = 0;
    this.img = img;
    this.show = function() {
        image(img, this.x, this.y);
    };

    this.update = function() {

          this.x += this.xSpeed;
          this.y += this.ySpeed;

        if (this.x > width || this.x < 0) {
            this.xSpeed = this.xSpeed * -1;
        }
        if (this.y > height || this.y < 0) {
            this.ySpeed = this.ySpeed * -1;
        }

    };
    this.dir = function(x, y) {
      this.xspeed = x;
      this.yspeed = y;
  }
}

1 个答案:

答案 0 :(得分:0)

你需要后退一步debug your program。例如,您确定keyPressed()函数正在触发吗?您确定if语句是否按预期方式运行?您确定正在调用player.dir()函数吗?

使用console.log()语句或使用JavaScript调试器来回答上述所有问题。确切地确定哪一行代码的行为与您的预期不同,然后在MCVE中隔离该问题。 (例如,如果问题与加载图像没有直接关系,请不要包含图像加载代码。请改用基本矩形。)祝您好运。