Continuando con esta serie de tutoriales de Scratch, hoy vamos a experimentar con algunos conceptos presentes en muchos vídeo juegos: detección de colisiones, caída libre y saltos

 

Vídeo Tutorial

 

Contenido:

• Los objetos: Pintando El cuadrado y los Detectores
• Detectando colisiones
  • Una nueva variable “tocando”
  • Detectamos la colisión
  • Copiamos el código usando “la mochila”
• El Cuadrado
  • Una nueva variable global: “la gravedad”
  • En caída libre
  • Detectando el borde: sin pasarse de la raya
  • Una nueva variable de impulso: “salto”
  • Tomando impulso: implementando el salto
  • Jugando con los valores de gravedad y salto

 

Los objetos: Pintando El cuadrado y los Detectores

Lo primero que vamos a hacer es construir nuestro objeto principal: El Cuadrado, y lo vamos a dotar de ocho detectores:

• 4 detectores para saber si el objeto esta en contacto con otro objeto o el borde
• 4 detectores para saber si el objeto esta intentando atravesar un objeto solido o el borde

Para ello vamos a utilizar la opción Dibujar Nuevo Objeto y usar el pincel para pintar cada uno de los 9 objetos. Si quieres te puedes apoyar en el vídeo (minuto 0:05) para ver todo el proceso, ¡es muy sencillo!

¡Fíjate bien en la posición y tamaño de los detectores, es muy importante!

Es importante pintar los detectores al borde del cuadrado y dejando libres las esquinas, de esta forma evitamos  por ejemplo que el detector “abajo” detecte cuando esta tocando a la “izquierda” o a la “derecha” ¿lo ves?

Asimismo es importante que los detectores interiores no se solapen con los exteriores ¡por eso son mas pequeños!

 

 

Detectando colisiones

Una vez que hemos pintado los objetos del programa, vamos a añadirles la funcionalidad. Vamos a utilizar los objetos “detectores” para conocer cuando el Cuadrado esta tocando o intentando atravesar otro objeto o el borde.

Esta es la estrategia que vamos a utilizar:

• Cada uno de los detectores siempre sigue la posición de el cuadrado y se coloca detrás de el, para ello usaremos las función: “ir a” (Movimiento) “establecer efecto desvanecer” (Apariencia)
• Una vez en la posición del Cuadrado si detectamos que esta “tocando el borde” (Sensores) entonces establecemos el valor de la variable “tocando” (Datos) a “true” (verdadero), sino la establecemos a “false” (falso)

Puedes ayudarte del vídeo tutorial a partir del minuto 2:25. Vamos por pasos:

Una nueva variable “tocando”

Seleccionamos el primero de los detectores, el detector arriba por ejemplo,  y creamos una nueva variable “tocando” en la sección de Datos, acuérdate de marcar la variable “* solo para este objeto” ¡es muy importante!

Tienes que crear una variable para cada uno de los objetos detectores.

Detectamos la colisión

Este es el código de cada uno de los detectores con la estrategia que explicábamos mas arriba:

Copiamos el código usando “la mochila”

Como vamos utilizar el mismo código para todos los detectores, ya que la estrategia de detección de colisiones es la misma, podemos ahorrar un poco de tiempo si copiamos el bloque de código de un objeto a otro. Fíjate como se puede copiar el código de un objeto a otro usando La Mochila:

Vídeo minuto 3:35

Usando la mochila copiamos el bloque de código a todos los demás detectores, ¿es mas cómodo así verdad?

El Cuadrado

Ahora que ya hemos creado los objetos y hemos implementado la detección de colisiones vamos a jugar con El Cuadrado. Hoy vamos a conseguir que el cuadrado caiga al vacío cuando no este apoyado en el borde inferior y a que salte cuando apretemos la tecla flecha arriba.

Puedes apoyarte en el vídeo tutorial a partir de el minuto 5:03

Aquí puedes ver el código completo de el Cuadrado, pero mejor, vallamos por partes:

 

Vamos allá:

Una nueva variable global: “la gravedad”

Ahora vamos a crear una nueva variable “gravedad” en la sección de Datos y la vamos a crear como una variable “* para todos los objetos” ya que no se trata de una variable exclusiva de ninguno de los objetos.

Utilizando botón secundario del ratón (haciendo click con el botón derecho) puedes convertir el indicador de la variable en un deslizador, esto nos va a permitir jugar después con distintos valores para la gravedad.

 

En caída libre

Para conseguir que el objeto se caiga cuando no esta apoyado en el borde inferior vamos a hacer lo siguiente:

• Crear una variable velocidad_y que contendra el valor de la velocidad vertical
• Comprobar si el objeto “abajo” tiene su variable “tocando” igual al valor “true”
  • en ese caso hacemos la velocidad_y igual a cero (no se mueve)
  • en caso contrario cambiamos (incrementamos) el valor de la velocidad_y utilizando el valor de la gravedad
• Ahora cambiamos la “posición y” (Movimientos) con el valor que hemos calculado de la velocidad_y. Ahora es cuando el objeto cambia realmente de posición.

NOTA: multiplicamos el valor de la gravedad por un numero decimal negativo por dos razones:

1. Multiplicándola por un numero decimal hacemos que el movimiento sea mas adecuado al tamaño del escenario (movimiento mas lento para valores enteros de la gravedad)
2. Multiplicándola por un numero negativo hacemos que el objeto se mueva “hacia abajo”. Prueba a usar un numero positivo a ver que pasa.

 

Detectando el borde: sin pasarse de la raya

Para evitar que el Cuadrado atraviese el borde inferior, vamos a utilizar el objeto que hemos llamado “interior abajo”:

• Si el detector “interior abajo” esta “tocando” el borde
  • entonces establecemos la velocidad al valor 2. De esta manera el Cuadrado ascenderá dos “puntos” dejando de atravesar el borde.

 

Aquí tienes el código integrado con el resto de bloques del Cuadrado:

 

Una nueva variable de impulso: “salto”

Vídeo minuto 9:09

Vamos a crear una variable para el objeto Cuadrado y convertirla en deslizador ¿te acuerdas como habíamos hecho con la variable “gravedad”, verdad?. En este caso la vamos a marcar como “* solo para este objeto”

Tomando impulso: implementando el salto

Para implementar el salto vamos a hacer lo siguiente:

• Si el Cuadrado esta apoyado en el borde inferior entonces puede hacer el salto:
  • Si se pulsa la tecla “flecha arriba” entonces fijamos la velocidad_y al valor de “salto”
  • sino ponemos la velocidad a cero
• Recuerda que si el Cuadrado no esta apoyado estaría en caída libreeeee!!!

 

 

Jugando con los valores de gravedad y salto

Ahora que el proyecto esta implementado puedes probar distintas combinaciones de los valores de “salto” y “gravedad” y utilizar la tecla “flecha arriba” para comprobar el efecto que tiene en los saltos.

El código del Cuadrado completo será algo parecido a esto:

 

 

 

¿Que te ha parecido? ¿Ya estas deseando añadirle movimiento en horizontal y saltos con distintos niveles y pisos?

Sabes que si tienes cualquier duda o sugerencia puedes dejar un comentario mas abajo. ¡ Estaremos encantados de saludarte!

¡Nos vemos en el próximo tutorial!