Funzioni di sistema della tastiera

Cliccare sul canvas e premere i tasti freccia destra/sinistra della tastiera.

    let diametro = 10;

function draw() {
    background( 200 );
    circle( 50, 50, diametro );
}

function keyPressed() {
    if (keyCode == RIGHT_ARROW) {
        diametro += 2;
    } else if (keyCode == LEFT_ARROW) {
        diametro -= 2;
    }
}
  

  function /*1*/keyPressed()/**/ {

Funzione chiamata da p5.js quando un tasto della tastiera viene premuto.

  if (/*1*/keyCode/**/ == RIGHT_ARROW) {
    diametro += 2;
} else if (/*1*/keyCode/**/ == LEFT_ARROW) {
    diametro -= 2;
}

La variabile di sistema keyCode contiene il codice del tasto (non del carattere) premuto. Se il valore è uguale al codice del tasto freccia destra, il diametro del cerchio viene incrementato di 2 pixel, altrimenti, se è uguale al codice del tasto freccia sinistra, il diametro viene decrementato di 2 pixel.

Se è necessario rilevare lo stato di più tasti in modo continuo, è possibile utilizzare la funzione keyIsDown() con la quale il codice potrebbe diventare:

  let diametro = 10;
function draw() {
    background( 200 );
    if (keyIsDown(RIGHT_ARROW)) {  // se tasto "->" premuto...
        diametro += 0.5;
    }
    if (keyIsDown(LEFT_ARROW)) {   // se tasto "<-" premuto...
        diametro -= 0.5;
    }
    circle( 50, 50, diametro );
}