En nuestra última guía paso a paso,
mostramos cómo animar una bola que rebota en los bordes de la pantalla usando la función "draw" y la sentencia "if"
Vamos a revisar.
En primer lugar, hemos creado algunas variables iniciales para la posición y la velocidad de una bola.
Después en la función "draw", que es esa función especial que se llama una y otra vez mientras el programa está corriendo,
repintamos el fondo y dibujamos una elipse en la pantalla
y posicionamos esa elipse con base en la variable de posición y de velocidad y cómo se afectan mutuamente.
Ahora, sin la sentencia "if", nuestra bola sólo siguió adelante por siempre,
o hasta que presionamos reiniciar.
Así que incluimos dos sentencias "if" aquí abajo
para revisar y ver si la bola estaba cerca del borde derecho o del borde izquierdo de la pantalla,
y en caso de que así fuera, cambiamos la variable "speed" para que fuera positiva o negativa de modo que la bola básicamente rebotara de un lado a otro.
Entonces ahora tenemos esta bola, rebotando de un lado a otro para siempre.
Eso está muy bien, y hay muchas animaciones realmente interesantes que podemos hacer con esto.
Pero ahora, quiero añadir la interacción del usuario a este programa.
Verán, en este momento este programa es como un show de televisión.
si se lo das a un amigo, y tu amigo no sabe como programar, no podría interactuar con él.
Todo lo que podría hacer es mirar, lo cual es genial,
pero sería mejor si pudiera hacer algo más.
Así que vamos a darle al usuario algunas formas de controlar el programa.
Recuerda que antes aprendimos sobre dos variables globales especiales llamadas "mouseX" y "mouseY".
Esas variables nos regresan números que nos dicen la posición actual del ratón del usuario
y son una manera genial de hacer que el programa sea más interactivo.
Así que veamos. ¿Cómo las podemos usar?
Bueno, deberíamos usarlas en algún lugar dentro de la función "draw".
Porque es el único código que se ejecuta una y otra vez mientras el programa corre.
Todo lo que está fuera de la función "draw" es llamado sólo una vez, cuando el programa inicia.
Así que no tiene sentido usar "mouseX" y "mouseY" ahí fuera.
El usuario no tendría oportunidad de interactuar con él.
En la función "draw", en este momento estamos dibujando la bola 200 pixeles abajo en la pantalla.
¿Qué pasa si reemplazamos eso con "mouseY"?
Porque esa es la posición de "y", ¿cierto?
De esta manera añadirá la posición de "y" dependiendo de la posición de "y" del usuario. ¿correcto?
Revisemos esto. Moviendo mi cursor arriba y abajo, puedo cambiar la línea en la que la bola se mueve.
Eso es genial. Pero también quiero usar "mouseX".
Entonces, ¿cómo puedo usarla?
Bueno, por qué no hacemos otra bola
y hacemos que esta bola vaya en la dirección opuesta: arriba y abajo.
Y ahí tendríamos al usuario controlando la posición "x" de esta bola.
Así que haríamos lo contrario.
Digamos "ellipse (mouseX, position, 50, 50)" ¿correcto?
¡Verifiquemos esto! Ahora tengo estas dos bolas que yo controlo y que van en direcciones perpendiculares.
Pero todavía no estoy contenta.
Quiero darle al usuario más control.
Quiero darle al usuario el poder de poner en marcha la segunda bola.
Para que realmente haga que exista, sólo con presionar el ratón.
Bueno, entonces tengo que encontrar la manera de decirle al programa que el usuario está presionando su ratón.
Afortunadamente, tenemos una variable booleana súper especial para esto.
Se llama "mouseIsPressed" y podemos usarla dentro de una sentencia "if".
Veamos, ésta es nuestra segunda bola.
Así que podemos escribir que si "mouseIsPressed", y luego moveremos la instrucción de elipse para acá.
Entonces lo que estamos haciendo aquí, es decirle al programa que sólo queremos dibujar esta elipse si esto es verdad
y "mouseIsPressed" será verdadera si el usuario está presionando su ratón.
Tratemos.
¡Tan tan!
Ahora puedo hacer que la bola aparezca cuando presiono el ratón.
Esto es un acercamiento de este universo paralelo. ¡Aparece! ¡Aparece! ¡Aparece!
¡Es impresionante!
Así que lo interesante de esta variable "mouseIsPressed"
es que cambia con base en lo que el usuario hace, y no en lo que programa hace.
Y como la función "draw" se llama repetidamente, una y otra vez,
el resultado del programa cambiará con el tiempo
sólo con una pequeña entrada del usuario.
Con el poder combinado de la sentencia "if" y la variable "mouseIsPressed",
tienes todo lo que necesitas para hacer cosas impresionantes como botones y programas de dibujo.
¡Yuju!