En esta sesión veremos:
– Respuesta a dispositivos como el mouse y el teclado
– Funciones y eventos: void setup(), void draw(), mousePressed(), mouseReleased(), keyPressed(), keyReleased()

El código que responde a un imput del mouse, el teclado o cualquier otro dispositivo, debe estar constantemente corriendo. Para hacer que esto suceda, habrá que poner las líneas de código dentro de una función (evento) de Processing llamada draw().

La función setup() corre sólo una vez, por lo que acá se escriben las líneas de código que definen lo que pasa desde el comienzo del código y permanece igual durante todo el programa (como por ejemplo el tamaño de la ventana). En la función draw(), en cambio, estará iterando durante todo el tiempo que el programa esté corriendo, por lo que será necesaria cada vez que necesitemos comprobar o comparar estados o simplemente repetir cosas.

Para ejemplificar nos basaremos en los ejemplos que aparecen en el libro Getting started with Processing de Reas y Fry.

Descripción del comportamiento Sketch 1: al mover el mouse se van dibujando líneas que cambian su grosor y color según la velocidad del movimiento. Usamos: void draw(); void setup(); colorMode(HSB); mouseX mouseY pmouseX pmouseY.

——-

Descripción del comportamiento Sketch 2: una ellipse sigue la posición del mouse de manera orgánica por medio del uso de la variable ‘easing’. Ésta puede ir de 0 a 1, en donde 0 es la aceleración máxima y 1 es cero aceleración. El nombre de la variable ‘easing’ es un nombre descriptivo, por lo que podría llamarse de cualquier manera.
Usamos: mouseX, mouseY, easing con valor 0.1, void setup(); void draw();

——-

Descripción del comportamiento Sketch 3: Un segundo ejemplo en donde a partir del seguimiento del mouse, se dibuja una línea. Se calcula la distancia de entre la posición presente y la recién pasada y controlamos la cantidad de cuadros por segundo.
Usamos: mouseX, mouseY, easing con valor 0.05, void setup(); void draw(); dist(); frameRate();

——-

Descripción del comportamiento Sketch 4: Se ejemplifica el uso del condicional ‘if’, en donde se pregunta si el click izquierdo del botón está presionado a través de == true; una condición booleana (puede también ser ‘false’).
Usamos: void setup(); void draw(); if (mousePressed == true) { } else { }

——-

Descripción del comportamiento Sketch 5: Se cambia el comportamiento de los elementos en la ventana a partir de la ubicación del mouse. Definimos una variable llamada offset que se utiliza para ‘cambiar la dirección de la flecha’.
Usamos: void setup(); void draw(); if (mousePressed == true) { } else { }