Juego en PyGame - PONG - Parte 1
 |
| Jugando PONG en la Magnavox Odyssey |
En esta entrada recrearemos el clásico PONG; este videojuego está
considerado como el más importante de entre la primera generación de
videojuegos modernos, debido a que fue el primero en llegar a los hogares en la
primera consola de videojuegos de la historia, el Magnavox Odyssey
considerado como el más importante de entre la primera generación de
videojuegos modernos, debido a que fue el primero en llegar a los hogares en la
primera consola de videojuegos de la historia, el Magnavox Odyssey
*Puedes consultar mas información en este enlace:
Con el fin de no hacer muy larga la entrada, haré este tutorial en 3 partes y al final podrán pasar horas de diversión con sus amigos con esta
versión de PONG desarrollada en Python ayudándonos con el módulo PyGame.
versión de PONG desarrollada en Python ayudándonos con el módulo PyGame.
Función del juego
Contará con
sus dos barras laterales para ser controladas por el jugador 1 y 2, una pelota
que rebota si toca las barras o de lo contrario iniciara un juego nuevo
asignando la puntuación a quien haya ganado y se vera así:
sus dos barras laterales para ser controladas por el jugador 1 y 2, una pelota
que rebota si toca las barras o de lo contrario iniciara un juego nuevo
asignando la puntuación a quien haya ganado y se vera así:
La pelota aumentara su velocidad ligeramente cada vez que rebote en una barra.. pero lo mejor de todo es que tendrá SONIDOS!... nuestro primer juego
con sonidos!…. Wow!!. (• ◡ •)/
con sonidos!…. Wow!!. (• ◡ •)/
Recursos
Primeramente
descargamos los recursos que utilizaremos aquí:
descargamos los recursos que utilizaremos aquí:
En el encontraremos nuestra plantilla y un “enorme” repertorio de
sonidos (rebote.wav y pierdes.wav) ಠ_ಠ ¯_(ツ)_/¯
sonidos (rebote.wav y pierdes.wav) ಠ_ಠ ¯_(ツ)_/¯
*En mi articulo PSPLT hice un análisis de la plantilla
y explique todo lo que necesitas tener instalado para que funcione, así que si
no estás familiarizado con esto, te recomiendo que lo leas primero.
y explique todo lo que necesitas tener instalado para que funcione, así que si
no estás familiarizado con esto, te recomiendo que lo leas primero.
Muy bien manos a la obra… ᕕ(
՞
ᗜ
՞
)ᕗ
՞
ᗜ
՞
)ᕗ
Bueno antes de empezar con
lo principal, en esta ocasión haremos un pequeño cambio a la plantilla:
lo principal, en esta ocasión haremos un pequeño cambio a la plantilla:
 |
| Constantes |
Agregamos las constantes ANCHO y ALTO
y de la función principal main() removemos las variables ancho y alto quedando así:
y de la función principal main() removemos las variables ancho y alto quedando así:
 |
| Dimensión de la ventana y etiqueta |
Esto con la finalidad de
tener acceso a estos valores más fácilmente ya que vamos a utilizarlos constantemente en la
elaboración de las clases.
tener acceso a estos valores más fácilmente ya que vamos a utilizarlos constantemente en la
elaboración de las clases.
Bueno ahora si … manos a la obra…
ᕕ( ՞ ᗜ ՞ )ᕗ
ᕕ( ՞ ᗜ ՞ )ᕗ
Construcción del juego
¿De que consta el juego
Pong?¿Qué es lo que hace al Pong que sea el Pong? Elemental mi querido
Pythonista.. una pelota, 1 barra para el jugador 1 y otra para el jugador
2……
Pong?¿Qué es lo que hace al Pong que sea el Pong? Elemental mi querido
Pythonista.. una pelota, 1 barra para el jugador 1 y otra para el jugador
2……
Así que crearemos una clase
para crear la pelota que llamaremos Bola() y otra clase llamada Barra()
con la que crearemos a los 2
jugadores, nos quedaría así:
para crear la pelota que llamaremos Bola() y otra clase llamada Barra()
con la que crearemos a los 2
jugadores, nos quedaría así:
 |
| Clase Bola() y Barra() |
Como puedes ver, ambas
clases tendrán su método inicializador __init__() que contendrá las características de cada objeto, su método actualizar() que se encargara de la
lógica de ese objeto, es decir, como debe comportarse y el método dibujar() que se encargara de
dibujar nuestro objeto en la pantalla.
clases tendrán su método inicializador __init__() que contendrá las características de cada objeto, su método actualizar() que se encargara de la
lógica de ese objeto, es decir, como debe comportarse y el método dibujar() que se encargara de
dibujar nuestro objeto en la pantalla.
No creas que son los únicos
métodos que tendrán, a como vallamos avanzando les agregaremos uno que
otro método más de acuerdo a las necesidades que vallan surgiendo.
métodos que tendrán, a como vallamos avanzando les agregaremos uno que
otro método más de acuerdo a las necesidades que vallan surgiendo.
Creando a los jugadores
Vamos a iniciar con la clase Barra(), estableciendo sus características:
 |
| __init__ de la barra |
A nuestro método inicializador le pasamos el parámetro "jugador" con el que sabremos si
estamos creando al jugador 1 o 2, self.dimension
contendrá el ancho y largo de la barra, en pos_vertical la posición vertical inicial de la barra que con esa fórmula
se colocara en el medio. (*te
preguntaras porque no puse mejor el numero directamente en vez de una formula,
bueno hay una razón para esto y más adelante lo sabrás), Enseguida viene un if-elif que va a detectar
que jugador estamos creando asignándole su posición en self.pos (izquierda o derecha) dependiendo de qué jugador se está
creando y por ultimo self.velocidad y
self.acceleracion que usaremos para
controlar su movimiento.
estamos creando al jugador 1 o 2, self.dimension
contendrá el ancho y largo de la barra, en pos_vertical la posición vertical inicial de la barra que con esa fórmula
se colocara en el medio. (*te
preguntaras porque no puse mejor el numero directamente en vez de una formula,
bueno hay una razón para esto y más adelante lo sabrás), Enseguida viene un if-elif que va a detectar
que jugador estamos creando asignándole su posición en self.pos (izquierda o derecha) dependiendo de qué jugador se está
creando y por ultimo self.velocidad y
self.acceleracion que usaremos para
controlar su movimiento.
Ahora vamos al método dibujar de la clase Barra() y escribe lo siguiente:
 |
| Método dibujar de la barra |
El módulo pygame.draw.rect() nos permite dibujar
un rectángulo en la pantalla (más información sobre el modulo aquí: http://www.pygame.org/docs/ref/draw.html) este nos pide donde se va a dibujar (pantalla), de qué color será, su
posición y dimensiones.
un rectángulo en la pantalla (más información sobre el modulo aquí: http://www.pygame.org/docs/ref/draw.html) este nos pide donde se va a dibujar (pantalla), de qué color será, su
posición y dimensiones.
 |
| Características de la barra |
El punto central-vertical de la pantalla lo
obtendríamos con ALTO / 2 pero a
esto necesitamos restarle la mitad de lo que mide la barra de largo con self.dimension[1] / 2 para que la dibuje
exactamente en el centro, esta es la razón de porque pos_vertical = ALTO / 2 – self.dimension[1] / 2.
obtendríamos con ALTO / 2 pero a
esto necesitamos restarle la mitad de lo que mide la barra de largo con self.dimension[1] / 2 para que la dibuje
exactamente en el centro, esta es la razón de porque pos_vertical = ALTO / 2 – self.dimension[1] / 2.
Bueno y te preguntaras “¿porque mejor no sacar el valor
manualmente y ponerlo?” Bueno mi
querido pythonista imagínate que decides modificar el ancho de la cancha, con
esta fórmula, la barra siempre aparecerá centrada independientemente de que
dimensión le des a la cancha, y esto es lo genial de la programación. Tienes
que pensar en todas las posibilidades. Capish!.
manualmente y ponerlo?” Bueno mi
querido pythonista imagínate que decides modificar el ancho de la cancha, con
esta fórmula, la barra siempre aparecerá centrada independientemente de que
dimensión le des a la cancha, y esto es lo genial de la programación. Tienes
que pensar en todas las posibilidades. Capish!.
Bien ahora vamos a cerciorarnos de que nuestras barras
se dibujen correctamente en la pantalla. Así que..
se dibujen correctamente en la pantalla. Así que..
Vamos a la función principal main() y agregamos las siguientes 2 líneas:
 |
| Creando las barras |
Con barra1 =
Barra(1) creamos al jugador 1 y ya te imaginaras para qué es barra2 = Barra(2).
Barra(1) creamos al jugador 1 y ya te imaginaras para qué es barra2 = Barra(2).
Ahora nos vamos al bucle while y en la sección de dibujo ponemos
lo siguiente:
lo siguiente:
 |
| Dibujando las barras |
Con lo que le decimos al programa que nos dibuje las 2
barras en la pantalla.
barras en la pantalla.
Ejecuta y veras tus 2
barras perfectamente alineadas.
barras perfectamente alineadas.
(ง'̀-'́)ง
Nuestras barras podrán verse muy bonitas pintadas, pero necesitamos darles movilidad así que volvemos
a la clase Barra() y en su método actualizar() ponemos lo siguiente:
a la clase Barra() y en su método actualizar() ponemos lo siguiente:
 |
| Método actualizar |
Con self.pos[1]
acedemos a la posición vertical de la barra y con "+=" le sumamos el valor que contenga self.velocidad, pero hay un problema… self.velocidad lo iniciamos a 0
por lo que la barra nunca se moverá por lo que necesitamos crear un método para
modificar este valor dependiendo si queremos que la barra suba o baje, así que
a la clase Barra() le creamos un
nuevo método que se llamara mover():
acedemos a la posición vertical de la barra y con "+=" le sumamos el valor que contenga self.velocidad, pero hay un problema… self.velocidad lo iniciamos a 0
por lo que la barra nunca se moverá por lo que necesitamos crear un método para
modificar este valor dependiendo si queremos que la barra suba o baje, así que
a la clase Barra() le creamos un
nuevo método que se llamara mover():
 |
| Método mover de la barra |
Este método es al que llamaremos cada vez que
presionemos una tecla en específico; va a detectar si queremos que la barra no
se mueva, se mueva hacia arriba o se mueva hacia abajo.
presionemos una tecla en específico; va a detectar si queremos que la barra no
se mueva, se mueva hacia arriba o se mueva hacia abajo.
Como puedes ver si a este método le decimos “no”
pondrá la velocidad a 0, deteniendo
la barra, si le decimos “arriba” la velocidad la pondrá a -4 (valor con el que iniciamos self.aceleracion) provocando que la posición vertical se
reste creando el efecto de que la barra sube, y por ultimo “abajo” que hace lo
contrario.
pondrá la velocidad a 0, deteniendo
la barra, si le decimos “arriba” la velocidad la pondrá a -4 (valor con el que iniciamos self.aceleracion) provocando que la posición vertical se
reste creando el efecto de que la barra sube, y por ultimo “abajo” que hace lo
contrario.
Ya creamos los métodos, pero ahora hay que
utilizarlos, así que nos vamos a la función principal en la sección de
manejadores de eventos y agregamos lo siguiente:
utilizarlos, así que nos vamos a la función principal en la sección de
manejadores de eventos y agregamos lo siguiente:
 |
| Configurando las teclas |
*En mi articulo “PSPTL” explico el funcionamiento de los
manejadores de eventos.
manejadores de eventos.
En el evento cuando
presionamos alguna tecla (pygame.KEYDOWN),
con if event.key == pygame.K_w detecta
si la tecla presionada fue la “w”, de ser así, llamamos al método mover() de la barra 1 especificándole que queremos moverla hacia arriba, hacemos
lo mismo para cada tecla dependiendo su función. Para la barra 1 utilizaremos las teclas “w” y “s” y para la barra 2 las teclas “flecha arriba” y
“flecha abajo”.
presionamos alguna tecla (pygame.KEYDOWN),
con if event.key == pygame.K_w detecta
si la tecla presionada fue la “w”, de ser así, llamamos al método mover() de la barra 1 especificándole que queremos moverla hacia arriba, hacemos
lo mismo para cada tecla dependiendo su función. Para la barra 1 utilizaremos las teclas “w” y “s” y para la barra 2 las teclas “flecha arriba” y
“flecha abajo”.
Ahora en el evento cuando soltamos alguna tecla
(pygame.KEYUP), cada vez que se
suelten las teclas “w” o “s” llamamos al método de la barra 1 diciéndole “no” para que se detenga, de igual manera con
las teclas que le corresponden a la barra
2.
(pygame.KEYUP), cada vez que se
suelten las teclas “w” o “s” llamamos al método de la barra 1 diciéndole “no” para que se detenga, de igual manera con
las teclas que le corresponden a la barra
2.
Es hora de probar si ambas barras funcionan
adecuadamente pero antes hay que agregar las siguientes 2 líneas en la sección
de la lógica del juego para que estas funcionen:
adecuadamente pero antes hay que agregar las siguientes 2 líneas en la sección
de la lógica del juego para que estas funcionen:
 |
| Ejecución de la lógica de las barras |
Una vez hecho esto ejecuta el código, presiona
las teclas que asignamos y wuala!!.. tus barras se mueven!
las teclas que asignamos y wuala!!.. tus barras se mueven!
~(˘▾˘~)
Pero como te habrás dado cuenta, tal y como a un
perro sin correa, a tus barras no les importa nada y si presionas el suficiente
tiempo una tecla tu barra simplemente desaparece saliéndose de la pantalla. Así
que necesitamos educarlas estableciendo sus límites.
perro sin correa, a tus barras no les importa nada y si presionas el suficiente
tiempo una tecla tu barra simplemente desaparece saliéndose de la pantalla. Así
que necesitamos educarlas estableciendo sus límites.
En el método actualizar() de la clase Barra()
agregamos lo siguiente:
agregamos lo siguiente:
 |
| Estableciendo limites de las barras |
Con if
self.pos[1] < 0 detectamos si la barra se sale por la parte superior, de
ser así, la devuelve a su lugar dentro de la pantalla: y la siguiente condición
hace lo mismo pero con el límite inferior.
self.pos[1] < 0 detectamos si la barra se sale por la parte superior, de
ser así, la devuelve a su lugar dentro de la pantalla: y la siguiente condición
hace lo mismo pero con el límite inferior.
Ahora sí, ejecuta de
nuevo y listo ya tienes 2 barras que cumplen tus reglas.
nuevo y listo ya tienes 2 barras que cumplen tus reglas.
Hasta aquí la primera
parte de este tutorial, en la siguiente, continuaremos con la creación de la
Pelota.
parte de este tutorial, en la siguiente, continuaremos con la creación de la
Pelota.
-
Unknown dice: quisiera controlar la raqueta meidante un potenciometro y con arduino como seria?
Unknown Deja una respuesta
Muchas gracias!!!