Zusammenfassung der Tastaturinteraktionsfunktionen von p5.js

Dieses Mal bringe ich Ihnen eine Zusammenfassung der p5.js-Tastaturinteraktionsfunktion und welche Vorsichtsmaßnahmen bei der Verwendung der p5.js-Tastaturinteraktionsfunktion gelten. Hier sind die praktischen Fälle . Lasst uns einmal einen Blick darauf werfen.

1. Schlüsselwörter im Zusammenhang mit Tastaturinteraktion und Funktionen

keyIsPressed: Schlüsselwort, wahr, wenn die Taste gedrückt wird, andernfalls falsch

keyCode: Schlüsselwort, wird verwendet, um zu bestimmen, welche Taste gedrückt wird

keyPressed(): Funktion, wird einmal ausgelöst, wenn die Taste gedrückt wird

keyReleased(): Funktion, wird einmal ausgelöst, wenn die Taste losgelassen wird

keyIsDown(): Funktion, gibt true zurück, wenn die angegebene Taste gedrückt wird, andernfalls false

Das Folgende ist ein umfassenderer Fall, der von wsad und zxcv Ball gesteuert wird Bewegung:

var x=200; 
var y=200; 
var speed=2; 
 
function setup() {  
 createCanvas(400, 400); 
}  
 
function draw() {  
 background(220); 
 ellipse(x,y,20,20); 
 if(keyIsPressed){ 
  //持续触发 
  //字母用小写 
  if(key=='a'){ 
   x-=speed; 
  } 
  if(key=='d'){ 
   x+=speed; 
  } 
 } 
 if(keyIsDown(87)){ 
  //持续触发 
    //使用keyCode 
  //87即w 
  y-=speed; 
 } 
 if(keyIsDown(83)){ 
  //持续触发 
  //使用keyCode 
  //83即s 
  y+=speed; 
 } 
} 
 
function keyPressed(){ 
 //按键按下时触发一次 
 //字母用大写 
  if(key=='Z'){ 
  x-=20; 
 } 
 if(key=='X'){ 
  x+=20; 
 } 
} 
 
function keyReleased(){ 
 //按键松开时触发一次 
 //字母用大写 
  if(key=='C'){ 
  y-=20; 
 } 
 if(key=='V'){ 
  y+=20; 
 } 
}

Sehen Sie sich den Effekt an: http://alpha.editor.p5js.org/full/S1YQvEFIZ

2. Schlüssel und Schlüsselcode

Im folgenden Fall werden der Schlüssel und der Schlüsselcode der Taste ausgegeben, die Sie auf dem Bildschirm drücken. Mit dieser Methode können Sie den Schlüsselcode beim Schreiben eines Programms schnell finden:

function setup() {  
 createCanvas(400, 400); 
}  
 
function draw() {  
 background(220); 
 textAlign(CENTER); 
 textSize(30); 
 if(keyIsPressed){ 
  text(key,200,180);  
  text(keyCode,200,220);  
 } 
}

Ich glaube Ihnen Ich habe diesen Fall gelesen. Sie beherrschen die Methode. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

vue-cli+webpack erstellt einen Projektfehlerbericht

Wie das jquery Fullpage-Plug-in funktioniert der Kopf und das Ende

Das obige ist der detaillierte Inhalt vonZusammenfassung der Tastaturinteraktionsfunktionen von p5.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!