So verwenden Sie die Tastaturinteraktion von p5.js in einem Projekt

Dieses Mal zeige ich Ihnen, wie Sie die Tastaturinteraktion von p5.j im Projekt verwenden und welche Vorsichtsmaßnahmen für die Verwendung der Tastaturinteraktion von p5.j im Projekt gelten. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

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

keyIsPressed: Schlüsselwort, es ist wahr, wenn die Taste gedrückt wird, andernfalls ist es 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 ausgelöst, wenn Die Taste wird losgelassen. Einmal auslösen

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

Das Folgende ist ein umfassenderer Fall, bei dem wsad und zxcv zur Steuerung verwendet werden Bewegung des Balls:

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 gedrückt haben. 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, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Inhalte finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

jquery+fullpage fügt den Header und das Copyright in die Schnittstelle ein

preload()-Funktion und Bilder Hochladen mit

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Tastaturinteraktion von p5.js in einem Projekt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!