Práctica 12: Interacción con el teclado

En esta práctica vamos a aprender cómo podemos actuar en función de eventos que se produzcan en nuestro teclado.

Para saber si una tecla fue presionada podemos utilizar la variable booleana keyPressed , que devuelve el valor true si alguna tecla fue plsada y false si no se pulsó ninguna. Por otro lado, tenemos la variable de estado key, que nos devuelve el valor de la última tecla pulsada. La variable key se suele utilizar cuando utilizamos teclas de letras y números, mientras que keyCode se utiliza cuando utilizamos teclas de símbolos y caracteres especiales (SHIFT, CTRL, UP, DOWN, etc). También es posible implementar las funciones keyPressed() y keyReleased() que serán invocadas cada vez que se presione o suelte una tecla respectivamente.

Veamos algunos ejemplos para familiarizarnos con estas funciones:

Ejemplo 1:

void setup()
{

}

void draw() {
if (keyPressed)
{
println(“Has pulsado la tecla:” + key);
}
}

Este ejemplo nos muestra por la consola del IDE la tecla que vamos pulsando:

Ejemplo 2:

void setup()
{
size(500,500);
}

void draw() 
{
if (key==’r’) //si pulso la tecla r
{
fill(255,0,0); //relleno de color ROJO
}
if (key==’g’) //si pulso la tecla g
{
fill(0,255,0); //relleno de color VERDE
}
if (key==’b’) //si pulso la tecla b
{
fill(0,0,255); //relleno de color AZUL
}

ellipse(250,250,300,300);

}

Con este ejemplo, si pulsamos la tecla de la “r”, pintará un círculo rojo, si pulsamos la tecla de la “g”, pintará un círculo verde, y si pulsamos la tecla de la “b”, pintará un círculo azul.

Ejemplo 3:

void setup()
{

}

void draw() {
if (keyPressed)
{
println(“El código de la tecla pulsada es:” + keyCode);
}
}

Con este código averiguamos el código de cualquier tecla de función. Esto nos servirá para el siguiente ejemplo, donde vamos a controlar la posición de un círculo con las teclas de flechas (izq, der, arriba y abajo).

Si lo ejecutamos, veremos que los códigos son:

• Flecha DERECHA: 39
• Flecha IZQUIERDA: 37
• Flecha ARRIBA: 38
• Flecha ABAJO: 40

Ejemplo 4:

int x = 300;
int y = 300;
void setup()
{
size(600,600);
background(0,0,0);
}

void draw()
{
if(keyPressed)
{

switch(keyCode)

{
case 38: //arriba……..también admite UP
y–;
break;
case 40: //abajo………también admite DOWN
y++;
break;
case 39: //derecha……también admite RIGHT
x++;
break;
case 37: //izquierda…..también admite LEFT
x–;
break;
default:
break;
}
background(0,0,0);
if(x>=575) //limita la trayectoria hacia la derecha
x= 575;
if(x<=25) //limita la trayectoria hacia la izquierda
x=25;
if(y>=575) //limita la trayectoria hacia abajo
y= 575;
if(y<=25) //limita la trayectoria hacia arriba
y=25;

ellipse(x,y,50,50);
println(“x: “+ x +”,y: ” + y);
}
}

TAREAS

1.Realizar un programa que dibuje un circulo en el centro de la ventana y que podamos modificar su diámetro mediante las flechas UP (aumentaría diámetro) y DOWN (disminuiría diámetro). Tomar la precaución de que no crezca más que el tamaño de la ventana.