如何在 p5.js 中注册按键

在 p5.js 中，注册按键操作可以让我们对用户的键盘输入做出响应，例如游戏中的移动、攻击等操作。下面我们来介绍如何在 p5.js 中进行按键注册。

步骤

步骤一：声明全局变量

在开始注册按键操作之前，需要先声明一个全局变量用于存储键盘输入。在 p5.js 中，我们可以使用 key 函数来获取用户最近一次按下的按键，使用 keyCode 函数来获取该按键的 ASCII 码值。

let keyInput; // 全局变量，用于存储键盘输入

function keyPressed() {
  keyInput = keyCode;
}

步骤二：注册按键操作

在 setup 函数中，我们通过调用 createCanvas 函数来创建画布，并使用 keyPressed 函数来注册按键操作。

function setup() {
  createCanvas(400, 400);
  keyPressed(); // 注册按键操作
}

步骤三：响应按键输入

在 draw 函数中，我们可以根据用户的按键输入来做出相应的操作。例如检测用户是否按下空格键，在按键按下时让小球跳起来。

function draw() {
  background(220);

  // 检测用户是否按下空格键
  if (keyInput === 32) {
    // 让小球跳起来
    let y = height / 2 - 50 * (sin(frameCount * 0.1) + 1);
    fill('red');
    circle(width / 2, y, 50);
  }
}

示例代码

let keyInput; // 全局变量，用于存储键盘输入

function keyPressed() {
  keyInput = keyCode;
}

function setup() {
  createCanvas(400, 400);
  keyPressed(); // 注册按键操作
}

function draw() {
  background(220);

  // 检测用户是否按下空格键
  if (keyInput === 32) {
    // 让小球跳起来
    let y = height / 2 - 50 * (sin(frameCount * 0.1) + 1);
    fill('red');
    circle(width / 2, y, 50);
  }
}

结语

以上就是在 p5.js 中注册按键操作的方法，希望本文对大家有所帮助。如果您有任何问题或建议，欢迎在评论区留言。