我希望用户能够按 a+d 一次 并且我的游戏应该增加分数,而不是按住它来增加得分,类似于按下 a+d 会在游戏中产生特殊效果。
此代码不起作用,所以我懒得将其称为失败尝试测试。
function keyPressed() {
if (key == 'a' && key == 'd')
score += 1;
}
这是我第一次失败的尝试:
function keyPressed() {
if (key == 'a' || key == 'd')
score += 1;
}
这是我第二次失败的尝试。
这是因为当我按下1个按钮时,它仍然增加分数,而当按下2个按钮并按住它们时增加更快但不会停止,这不是我的想法。
Score2keypress.js:
let RightButtom = false;
let LeftButtom = false;
let character = {
"score": 0
}
function setup() {
createCanvas(600, 600);
}
function draw() {
background(220);
// draw score character
fill(0, 0, 255); //move6
text("Score: " + character.score, 20, 120);
// update score increase character
if (RightButtom) {
character.score += 1;
} //move8
if (LeftButtom) {
character.score += 1;
} //move10
/////////////ScoreExtra
// show boolean values onscreen for clarity
textSize(20);
text("RightButtom = " + RightButtom +
"\nLeftButtom = " + LeftButtom, 10, 10, width / 2, height / 2);
}
//////////////ScoreExtra
function keyPressed() {
if (key == 'a') {
LeftButtom = true;
}
if (key == 'd') {
RightButtom = true;
}
}
function keyReleased() {
if (key == 'a') {
LeftButtom = false;
}
if (key == 'd') {
RightButtom = false;
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.js"></script>
最佳答案
有几种方法。事件驱动的方法是使用 p5 的 keyPressed
和 keyReleased
回调,拉 key 的 code
来自 native KeyboardEvent
对象的字符串。向 pressed
集添加和删除这些键码可让您实现单触发逻辑的变体。
const character = {score: 0};
const pressed = new Set();
function setup() {
createCanvas(600, 600);
textSize(20);
}
function draw() {
background(220);
text("Score: " + character.score, 20, 50);
}
function keyPressed(evt) {
const {code} = evt;
if (!pressed.has(code)) {
pressed.add(code);
if (pressed.has("KeyA") && pressed.has("KeyD")) {
character.score++;
}
}
}
function keyReleased(evt) {
pressed.delete(evt.code);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script>
如果你想纯粹在draw
中检测并采取行动,p5.js提供keyIsDown
它接受参数 keycode .
const character = {score: 0};
const pressed = new Set();
function setup() {
createCanvas(600, 600);
textSize(20);
}
function draw() {
background(220);
text("Score: " + character.score, 20, 50);
if (keyIsDown(65) && keyIsDown(68)) {
if ((keyIsDown(65) && !pressed.has(68)) ||
(!pressed.has(65) && keyIsDown(68))) {
character.score++;
}
pressed.add(65);
pressed.add(68);
}
if (!keyIsDown(65)) {
pressed.delete(65);
}
if (!keyIsDown(68)) {
pressed.delete(68);
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script>
如前所述,您可以实现多种行为变体。这是防止使用相同 key 重新触发的变体:
const character = {score: 0};
const pressed = new Set();
function setup() {
createCanvas(600, 600);
textSize(20);
}
function draw() {
background(220);
text("Score: " + character.score, 20, 50);
if (keyIsDown(65) && !pressed.has(65) && // 'a' and 'd'
keyIsDown(68) && !pressed.has(68)) {
character.score++;
pressed.add(65);
pressed.add(68);
}
if (!keyIsDown(65)) {
pressed.delete(65);
}
if (!keyIsDown(68)) {
pressed.delete(68);
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.5.0/p5.js"></script>
在上述所有情况下,该行为都会让用户无限期地按住一个键,然后再按另一个键。如果您希望在完全相同的帧上或在 n
帧内按下这些键,您可以在该键已经存在 n
帧后将其从集合中删除,并且将它添加到 requireRetrigger
集,以防止它在被释放之前触发操作。 keyReleased
在这里可能会很方便。
关于javascript - 在 p5.js 中检测多个按键并触发一次操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72881145/