jairogarcíarincón
Colisión con las plataformas
Para impedir que el muñeco atraviese las plataformas, bastará con añadir la siguiente línea en el método create(), por ejemplo, debajo de la colisión con los bordes:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| this.physics.add.collider(player, platforms); |
Si ahora ejecutas el juego verás que el muñeco cae hasta depositarse en el suelo.
Movimiento del jugador
El jugador debe poder moverse de izquierda a derecha y saltar entre plataformas. Para ello utilizaremos las flechas del teclado izquierda, derecha y arriba, respectivamente.
Lo primero que haremos será declarar como variable global, la variable cursors y a continuación, dentro de create(), inicializar dicha variable:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //variable para los cursores | |
| var cursors; | |
| /***********INSERTAR DENTRO DE CREATE******************/ | |
| //Inicializo los cursores | |
| cursors = this.input.keyboard.createCursorKeys(); |
A continuación añadiremos en el método update() todos los posibles movimientos del jugador, teniendo en cuenta que no puede volar, sino solo saltar, de modo que comprobaremos que está tocando el suelo o una plataforma antes de dejarle saltar:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Acciones que se realizan durante el juego (mover al jugador, actualizar contador, detectar colisiones, etc.) | |
| function update () | |
| { | |
| if (cursors.left.isDown) | |
| { | |
| player.setVelocityX(-160); | |
| player.anims.play('left', true); | |
| } | |
| else if (cursors.right.isDown) | |
| { | |
| player.setVelocityX(160); | |
| player.anims.play('right', true); | |
| } | |
| else | |
| { | |
| player.setVelocityX(0); | |
| player.anims.play('turn'); | |
| } | |
| if (cursors.up.isDown && player.body.touching.down) | |
| { | |
| player.setVelocityY(-330); | |
| } | |
| } |
Si ejecutas el juego, podrás ver cómo el jugador puede moverse hacia los lados (ejecutándose además la animación correspondiente) y saltar. Además, cuando se queda parado, el jugador queda mirando de frente (frame 4 del spritesheet). Prueba a cambiar los valores de velocidad y salto a tu gusto.
Publicado el 22 de Junio de 2025
phaservideosonido para videojuegos