Hasta mi último tutorial de plataformas, hemos creado un sencillo juego de plataformas con un cierto contenido agradable, sin embargo todavía hay algunas cosas que añadir antes de que se pueda reproducir. En este tutorial, vamos a añadir el siguiente contenido:


  • jugador vive, por lo que ahora en realidad se puede perder.
  • Los productos que incrementarán las vidas jugador o dar un ataque.
  • Un jefe nivel.

    No se pierda! extremos de la oferta en

    • Accede a los más de 200 cursos
    • Nuevos cursos añadió mensual
    • Cancelar en cualquier momento
    • Los certificados de terminación

      ACCESO ahora

      Indice

      archivos de código fuente

      Puede descargar los archivos de código fuente tutorial aquí.

      Juego Unidos

      En este tutorial, vamos a utilizar los mismos estados de la última:


      • Estado de arranque:. Carga un archivo JSON con la información de nivel y comienza la carga del Estado
      • Cargando Estado:. Cargas de todos los recursos del juego, e inicia el Estado Nivel
      • baldosa Estado:. Crea el mapa y todos los objetos del juego

        El código para todos los estados son casi los mismos, a excepción de dos métodos añadidos en TiledState: uno a hacer el juego una y otra para inicializar el HUD. Por lo tanto, voy a omitir por ahora y sólo mostrar los cambios cuando son necesarios.

        jugador vive

        Nuestro jugador comenzará con un número determinado de vidas, y perderá uno cada vez que muere a manos de un enemigo. Para hacer eso, vamos a cambiar el jugador prefabricadas para tener una propiedad vidas y el método de “morir” para disminuir el número de vidas si el jugador fue matado, de la siguiente manera:
        Platformer.Player.prototype.die = function () { «utilizar estricta»; this.lives – = 1; this.shooting = false; if (this.lives> 0) {this.game_state.restart_level (); } Else {this.game_state.game_over (); }}; 12345678910Platformer.Player.prototype.die = function () { «utilizar estricta»; this.lives- = 1; this.shooting = false; si (this.lives> 0) {this.game_state.restart_level (); } else {this.game_state.game_over ();}};

        Además, si el jugador número de vidas se convierte en cero, vamos a llamar al método “game_over” en TiledState, en lugar de “restart_level”:
        Platformer.TiledState.prototype.game_over = function () { «utilizar estricta»; localStorage.clear (); this.game.state.start ( «BootState», verdadero, falso, «activos / niveles / level1.json»);}; 12345Platformer.TiledState.prototype.game_over = function () { «utilizar estricta»; localStorage.clear ( ); this.game.state.start ( «BootState», verdadero, falso, «activos / niveles / level1.json»);};

        Además de tener las vidas de los jugadores, tenemos que mostrar cuántas vidas el jugador todavía tener. Por lo tanto, vamos a crear un Vidas prefabricadas que pertenece al grupo de HUD y muestran las vidas jugador actuales. Nuestras Vidas prefabricados tendrá el activo en vivo jugador, pero será invisible, ya que vamos a utilizar el activo sólo para crear nuevos sprites que muestran las vidas jugador.
        var Platformer = Platformer || {}; Platformer.Lives = función (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, la posición, propiedades); this.frame = + properties.frame; = This.visible FALSE; this.spacing = + properties.spacing; this.fixedToCamera = true; // guardar posición inicial si se cambia mediante el ajuste de ventanas this.initial_position = new Phaser.Point (this.x, this.y); this.lives = []; this.dead_life = null; this.create_lives ();}; Platformer.Lives.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Lives.prototype.constructor = Platformer.Lives; Platformer.Lives.prototype.update = función () { » utilizar estricta «; // actualizar para mostrar el número actual de vidas si this.update_lives {() == (this.game_state.prefabs.player.lives this.lives.length!); }}; Platformer.Lives.prototype.create_lives = function () { «utilizar estricta»; var life_index, life_position, la vida; // crear un sprite para cada uno de los jugador vidas para (life_index = 0; life_index la vida prefabricada tendrá un método “create_lives” que llena una matriz con un sprite para cada uno de los jugadores vidas. Dado que el activo en vivo jugador ya está cargado podemos utilizar su anchura y posición de la vida prefabricada para encontrar la posición de cada uno en vivo y dibujar en la pantalla. Por último, en el método de actualización tenemos que comprobar si el número de jugador de vida ha cambiado y, si es así, que llamamos un método “update_lives”.

        En el método “update_lives” Asumimos el número de vidas puede aumentar o disminuir por un solo entre dos actualizaciones. Esto tiene sentido porque el método de actualización se llama muchas veces por segundo, y el jugador no puede morir o tener vidas más rápido que eso. Por lo tanto, en el método “update_lives” sólo comprobar si el número de vidas que ha disminuido o aumentado. En el primer caso, tenemos que matar al último concierto de la matriz. En el segundo caso, vamos a hacer algunas comprobaciones para evitar crear demasiados objetos de la vida. En primer lugar, comprobamos si hay una vida muerta podemos reutilizar y, de ser así, simplemente restablecerla. De lo contrario, se crea un nuevo objeto de la vida.

        Hay dos últimas cosas que tenemos que hacer en relación con el jugador y el jugador vidas puntuación que no hicimos en el último tutorial. En primer lugar, usted notará añadí un método “init_hud” en TiledState (mostrada a continuación) que crean objetos del HUD en posiciones fijas en vez de cargarlo desde el mapa de baldosa. Hice esto porque a veces la escala mundial Phaser podría estropear con el HUD objetos puestos al volver a cargar la pantalla o la actualización de la vida. También salvar la vida prefabricada posición inicial por la misma razón.
        Platformer.TiledState.prototype.init_hud = function () { «utilizar estricta»; var score_position, partitura, lives_position, vidas; score_position = nuevo Phaser.Point (20, 20); puntuación = nueva Platformer.Score (esto, score_position, { «texto»: «Puntuación: 0», «grupo»: «HUD»}); this.prefabs [ «puntuación»] = puntuación; lives_position = new Phaser.Point (this.game.world.width * 0.65, 20); vidas = new Platformer.Lives (esto, lives_position, { «textura»: «player_spritesheet», «grupo»: «HUD», «marco»: 3, «espaciamiento»: 16}); this.prefabs [ «vidas»] = vidas;}; 1234567891011Platformer.TiledState.prototype.init_hud = function () { «utilizar estricta»; varscore_position, puntuación, lives_position, vidas; score_position = newPhaser.Point (20,20); puntuación = newPlatformer.Score (esto, score_position, { «texto»: «puntuación: 0», «grupo»: «HUD»}); this.prefabs [ «puntuación»] = puntuación; lives_position = newPhaser.Point (this.game .world.width * 0.65,20); vive = newPlatformer.Lives (esto, lives_position, { «textura»: «player_spritesheet», «grupo»: «HUD», «marco»: 3, «espaciamiento»: 16}) this.prefabs; [ «vidas»] = vidas;};

        en segundo lugar, tenemos que salvar la vida de los jugadores y anotar antes de cargar un nuevo nivel, de lo contrario será reiniciado. Para ello, vamos a guardar esta información en el almacenamiento local del navegador cuando se alcanza la meta. Además, en el constructor del jugador, en primer lugar comprobar si ya hay una puntuación anterior o vidas salvadas en el almacenamiento local y si es así, lo cargamos. Por último, en TiledState “game_over” método tenemos claro el almacenamiento local.
        Platformer.Goal.prototype.reach_goal = function () { «utilizar estricta»; // iniciar las localStorage.player_lives siguiente nivel = this.game_state.prefabs.player.lives; localStorage.player_score = this.game_state.prefabs.player.score; this.game_state.game.state.start ( «BootState», verdadero, falso, this.next_level);}; 1234567Platformer.Goal.prototype.reach_goal = function () { «use strict»; // iniciar la siguiente levellocalStorage.player_lives = this.game_state.prefabs.player.lives; localStorage.player_score = this.game_state.prefabs.player.score; this.game_state.game.state.start ( «BootState», verdadero, falso, this.next_level);};

        puede añadir las vidas prefabricadas a nuestros niveles actuales y ver cómo está funcionando ya:

        vidas

        Los productos

        Vamos a crear dos elementos diferentes:


        1. Una LifeItem, que aumentará el número de jugador de vidas.
        2. Una ShootingItem, que le dará al jugador la posibilidad de ataque.

          En primer lugar, vamos a crear una casa prefabricada de artículos genéricos para reunir el código común entre ambos elementos. Todos los artículos tendrán un cuerpo inamovible física inicializado en el constructor. Además, en el método de actualización se comprobará si hay superposición con el jugador y llamar a un método “collect_item” si eso sucede. Por defecto, el método “collect_item” sólo matar al artículo, pero lo sobrescribirá en nuestros nuevos artículos prefabricados para hacer lo que queremos.
          var Platformer = Platformer || {}; Platformer.Item = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, la posición, propiedades); this.game_state.game.physics.arcade.enable (this); = This.body.immovable verdaderos; this.body.allowGravity = false; this.anchor.setTo (0,5);}; Platformer.Item.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Item.prototype.constructor = Platformer.Item; Platformer.Item.prototype.update = function ( ) { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); this.game_state.game.physics.arcade.overlap (esto, this.game_state.groups.players, this.collect_item, null, este);}; Platformer.Item.prototype.collect_item = function () { «utilizar estricta»; // por defecto, el elemento se destruye cuando recogido this.kill ();}; 123456789101112131415161718192021222324252627varPlatformer = Platformer || {}; Platformer.Item = función (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, posición, propiedades); this.game_state.game.physics.arcade.enable (this); this.body.immovable = true; this.body.allowGravity = false; this.anchor.setTo (0,5); }; Platformer.Item.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Item.prototype.constructor = Platformer.Item; Platformer.Item.prototype.update = function () { «utilizar estricta»; esto. game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); this.game_state.game.physics.arcade.overlap (esto, this.game_state.groups.players, this.collect_item, null, este );}; Platformer.Item.prototype.collect_item = function () { «use strict»; // por defecto, el elemento se destruye cuando collectedthis.kill ();};

          Ahora, nuestra LifeItem será muy simple . Tan sólo hay que sobreescribir el método “collect_item” para aumentar el número de jugador de la vida después de llamar al método original “collect_item”, como a continuación:
          var Platformer = Platformer || {}; Platformer.LifeItem = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Item.call (Esto, game_state, posición, propiedades);}; Platformer.LifeItem.prototype = Object.create (Platformer.Item.prototype); Platformer.LifeItem.prototype.constructor = Platformer.LifeItem; Platformer.LifeItem. prototype.collect_item = function (artículo, reproductor) { «use strict»; Platformer.Item.prototype.collect_item.call (this); player.lives + = 1;}; 123456789101112131415varPlatformer = Platformer || {}; Platformer.LifeItem = function (game_state, la posición, propiedades) { «utilizar estricta»; Platformer.Item.call (esto, game_state, posición, propiedades); }; Platformer.LifeItem.prototype = Object.create (Platformer.Item.prototype); Platformer.LifeItem.prototype.constructor = Platformer.LifeItem; Platformer.LifeItem.prototype.collect_item = function (artículo, reproductor) { «use strict» ; Platformer.Item.prototype.collect_item.call (este); player.lives + = 1;};

          ya podemos ver nuestro juego trabajando con el LifeItem:

          life_item

          El ShootingItem también es simple, sólo tenemos que establecer una variable de tiro en el prefabricada jugador en true. Sin embargo, ahora tenemos que añadir la lógica de disparo en el prefabricada jugador.
          var Platformer = Platformer || {}; Platformer.FireballItem = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Item.call (Esto, game_state, posición, propiedades);}; Platformer.FireballItem.prototype = Object.create (Platformer.Item.prototype); Platformer.FireballItem.prototype.constructor = Platformer.FireballItem; Platformer.FireballItem. prototype.collect_item = function (artículo, reproductor) { «use strict»; Platformer.Item.prototype.collect_item.call (this); player.shooting = true;}; 123456789101112131415varPlatformer = Platformer || {}; Platformer.FireballItem = function (game_state, la posición, propiedades) { «utilizar estricta»; Platformer.Item.call (esto, game_state, la posición, propiedades);} ; Platformer.FireballItem.prototype = Object.create (Platformer.Item.prototype); Platformer.FireballItem.prototype.constructor = Platformer.FireballItem; Platformer.FireballItem.prototype.collect_item = function (artículo, reproductor) { «use strict»; Platformer.Item.prototype.collect_item.call (este); player.shooting = true;};

          para dar al jugador la posibilidad de disparar bolas de fuego, primero crear una bola de fuego prefabricada. La bola de fuego prefabricada creará un cuerpo físico con una velocidad constante dada por su dirección. Además, vamos a comprobar las colisiones, y cuando suceden, acabar con él.
          var Platformer = Platformer || {}; Platformer.Fireball = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, la posición, propiedades); this.direction = properties.direction; this.speed = + properties.speed; this.game_state.game.physics.arcade.enable (this); this.body.allowGravity = false; // velocidad es constante, sino que se define por la dirección si (this.direction == «LEFT») {this.body.velocity.x = -this.speed; } Else {this.body.velocity.x = this.speed; } This.anchor.setTo (0,5); // Fireball utiliza el mismo activo como FireballItem, por lo que es más this.scale.setTo un poco más pequeño (0,75);}; Platformer.Fireball.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Fireball.prototype .constructor = Platformer.Fireball; Platformer.Fireball.prototype.update = function () { «utilizar estricta»; // la bola de fuego se destruye si entra en contacto con cualquier cosa this.game_state.game.physics.arcade.collide más (esto, this.game_state.layers.collision, this.kill, null, este); this.game_state.game.physics.arcade.overlap (esto, this.game_state.layers.invincible_enemies, this.kill, null, este);}; 1234567891011121314151617181920212223242526272829303132varPlatformer = Platformer || {}; Platformer.Fireball = function (game_state, posición , propiedades) { «uso estricto»; Platformer.Prefab.call (esto, game_state, de posición, propiedades); this.direction = properties.direction; this.speed = + properties.speed; this.game_state.game.physics.arcade .enable (this); this.body.allowGravity = false; // velocidad es constante, sino que se define por directionif (this.direction == «LEFT») {this.body.velocity.x = -this.speed;} else {this.body.velocity.x = this.speed;} this.anchor.setTo (0,5); // Fireball utiliza el mismo activo como FireballItem, por lo que que sea un poco smallerthis.scale.setTo (0,75);}; Platformer.Fireball.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Fireball.prototype.constructor = Platformer.Fireball; Platformer.Fireball.prototype.update = function () { «utilizar estricta»; // la bola de fuego se destruye si en contacto con una ything elsethis.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision, this.kill, null, este); this.game_state.game.physics.arcade.overlap (esto, this.game_state. layers.invincible_enemies, this.kill, null, este);};

          con la bola de fuego prefabricadas creado, tenemos que añadir la capacidad de disparar en el prefabricada jugador. Para esto, empezar a comprobar en el método de actualización si el jugador es capaz de disparar y si se ha pulsado la tecla de disparo (barra espaciadora). Si es así, comenzamos un temporizador (creada en el constructor) que se llame al método disparar en un bucle.
          Platformer.Player.prototype.update = function () { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); this.game_state.game.physics.arcade.overlap (esto, this.game_state.groups.enemies, this.hit_enemy, null, este); // el jugador muere automáticamente si entra en contacto con los enemigos invencibles o bolas de fuego enemigo this.game_state.game.physics.arcade.overlap (Esto, this.game_state.groups.invincible_enemies, this.die, null, this); this.game_state.game.physics.arcade.overlap (esto, this.game_state.groups.enemy_fireballs, this.die, null, este); si (this.cursors.right.isDown && this.body.velocity.x> = 0) {// movimiento correcto this.body.velocity.x = this.walking_speed; this.direction = «RIGHT»; this.animations.play ( «pie»); this.scale.setTo (-1, 1); } Else if (this.cursors.left.isDown && this.body.velocity.x <= 0) {// mover hacia la izquierda this.body.velocity.x = -this.walking_speed; this.direction = "LEFT"; this.animations.play ( "pie"); this.scale.setTo (1, 1); } Else {// parada this.body.velocity.x = 0; this.animations.stop (); this.frame = 3; } // saltar sólo si tocando una baldosa si (this.cursors.up.isDown && this.body.blocked.down) {this.body.velocity.y = -this.jumping_speed; } // muere si toque el extremo de la pantalla si (this.bottom> = this.game_state.game.world.height) {this.die (); } // si el jugador es capaz de disparar y se pulsa el botón de disparo, si empezar a grabar (this.shooting && this.game_state.input.keyboard.isDown (Phaser.Keyboard.SPACEBAR)) {if (! This.shoot_timer. corriendo) {this.shoot (); this.shoot_timer.start (); }} Else {this.shoot_timer.stop (false); }}; 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647Platformer.Player.prototype.update = function () { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); this.game_state.game.physics .arcade.overlap (esto, this.game_state.groups.enemies, this.hit_enemy, null, este); // el jugador muere automáticamente si entra en contacto con los enemigos invencibles o fireballsthis.game_state.game.physics.arcade.overlap enemigo ( esto, this.game_state.groups.invincible_enemies, this.die, null, este); this.game_state.game.physics.arcade.overlap (esto, this.game_state.groups.enemy_fireballs, this.die, null, esto); si (this.cursors.right.isDown && this.body.velocity.x> = 0) {// movimiento correcto this.body.velocity.x = this.walking_speed; this.direction = «right»; this.animations.play ( «pie»); this.scale.setTo (-1,1);} elseif (this.cursors.left.isDown && this.body.velocity.x <= 0) {// mover hacia la izquierda this.body.velocity. x = -this.walking_speed; this.direction = "LEFT"; this.animations.play ( "Pie"); this.scale.setTo (1,1);} else {// stopthis.body.velocity.x = 0; this.animations.stop (); this.frame = 3;} // salto sólo si tocar un tileif (this.cursors.up.isDown && this.body.blocked.down) {this.body.velocity.y = -this.jumping_speed;} // muere si toques finales de la screenif (this.bottom > = this.game_state.game.world.height) {this.die ();} // si el jugador es capaz de disparar y se pulsa el botón de disparo, iniciar shootingif (this.shooting && this.game_state.input.keyboard. isDown (Phaser.Keyboard.SPACEBAR)) {if (! this.shoot_timer.running) {this.shoot (); this.shoot_timer.start ();}} else {this.shoot_timer.stop (falso);}};

          En el método de disparar vamos a utilizar un concepto llamado grupo de objetos. Para evitar crear y eliminar una gran cantidad de objetos, lo que podría afectar negativamente a nuestro rendimiento del juego, vamos a mantener un grupo de bolas de fuego (llamado una piscina) y cada vez que tenemos que crear otra bola de fuego, comprobamos si no hay una bola de fuego muerto en el piscina. Si es así, simplemente vuelve a establecer en la nueva posición. De lo contrario, se crea una nueva. Esto es similar a lo que hemos hecho en las vidas prefabricadas, y se espera que a medida que el juego continúa, habremos creado todas las bolas de fuego necesarias, y comenzará a reutilizar viejas bolas de fuego en lugar de crear otros nuevos.
          Platformer.Player.prototype.shoot = function () { «utilizar estricta»; bola de fuego var, fireball_position, fireball_properties; // obtener la primera bola de fuego muerto de la piscina bola de fuego = this.game_state.groups.fireballs.getFirstDead (); fireball_position = new Phaser.Point (this.x, this.y); (! Bola de fuego) si {// si no hay una bola de fuego muerto, crear una nueva fireball_properties uno = { «textura»: «fireball_image», «grupo»: «bolas de fuego», «dirección»: this.direction, «velocidad»: this.attack_speed}; bola de fuego = new Platformer.Fireball (this.game_state, fireball_position, fireball_properties); } Else {// si hay una bola de fuego muerto, vuelve a establecer en la nueva posición fireball.reset (fireball_position.x, fireball_position.y); fireball.body.velocity.x = (this.direction == «IZQUIERDA»)? -this.attack_speed: this.attack_speed; }}; 12345678910111213141516Platformer.Player.prototype.shoot = function () { «use strict»; varfireball, fireball_position, fireball_properties; // obtener la primera bola de fuego muerto de la poolfireball = this.game_state.groups.fireballs.getFirstDead (); fireball_position = newPhaser.Point (this.x, this.y); si {// si no hay una bola de fuego muerto, crear una nueva onefireball_properties = { «textura» (bola de fuego!): «fireball_image», «grupo»: «bolas de fuego» «dirección»: this.direction, «velocidad»: this.attack_speed}; bola de fuego = newPlatformer.Fireball (this.game_state, fireball_position, fireball_properties);} else {// si hay una bola de fuego muerto, vuelve a establecer en el nuevo positionfireball.reset (fireball_position.x, fireball_position.y); fireball.body.velocity.x = (this.direction == «IZQUIERDA») – this.attack_speed:? this.attack_speed;}};

          Ahora, puede ver nuestro trabajo juego con bolas de fuego:

          bola de fuego

          Nivel de Boss

          Para el nivel de jefe que añade un nuevo enemigo y el jefe, que son a la vez invencible, por lo que si el jugador lo toca, él siempre va a morir. Esto puede hacerse mediante la adición de un nuevo grupo (llamado “invincible_enemies”, que estaba realmente presente en algunos de los que se muestran código) y, si el jugador solapamientos con él, que muera de forma automática.

          enemigo Piedra

          El enemigo piedra se detendrá en el techo hasta que el jugador pasa por debajo de ella. Cuando eso sucede, el enemigo caerá sobre el jugador. Para ello, en el método de actualización se comprobará si el jugador está por debajo del enemigo, y si es así, el enemigo comienzan a caer.

          Para comprobar si el jugador, sólo tenemos que comparar la posición del jugador x para el enemigo a la izquierda y las coordenadas correctas, y la posición del jugador y debe estar por debajo del enemigo. Para hacer que el enemigo cae, sólo tenemos que cambie su propiedad allowGravity true, de la siguiente manera:
          var Platformer = Platformer || {}; Platformer.StoneEnemy = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, la posición, propiedades); this.game_state.game.physics.arcade.enable (this); this.body.allowGravity = false; this.anchor.setTo (0,5);}; Platformer.StoneEnemy.prototype = Object.create (Platformer.Prefab.prototype); Platformer.StoneEnemy.prototype.constructor = Platformer.StoneEnemy; Platformer.StoneEnemy.prototype.update = function ( ) { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); // si el jugador está por debajo, el enemigo va a caer después de algún tiempo si (this.check_player ()) {this.fall (); }}; Platformer.StoneEnemy.prototype.check_player = function () { «utilizar estricta»; var player; El jugador = this.game_state.prefabs.player; // Comprobar si el jugador está justo por debajo del rendimiento enemigo (player.x> this.left && player.x this.bottom);}; Platformer.StoneEnemy.prototype.fall = function () { «utilizar estricta»; // comienzan a caer this.body.allowGravity = true;}; 1234567891011121314151617181920212223242526272829303132333435363738varPlatformer = Platformer || {}; Platformer.StoneEnemy = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, posición, propiedades); this.game_state.game.physics.arcade.enable (this); this.body.allowGravity = false; this.anchor.setTo (0,5);}; Platformer.StoneEnemy.prototype = Object.create (Platformer .Prefab.prototype); Platformer.StoneEnemy.prototype.constructor = Platformer.StoneEnemy; Platformer.StoneEnemy.prototype.update = function () { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, este .game_state.layers.collision); // si el jugador está por debajo, el enemigo va a caer después de algún timeif (this.check_player ()) {this.fall ();}}; Platformer.StoneEnemy.prototype.check_player = function ( ) { «uso estricto»; varplayer; jugador = this.game_state.prefabs.player; // cheque si el jugador está justo por debajo de la enemyreturn (player.x> this.left && player.x este .bottom);}; Platformer.StoneEnemy.prototype.fall = function () { «use strict»; // iniciar fallingthis.body.allowGravity = true;};

          Y aquí está nuestro juego con el StoneEnemy:

          stone_enemies

          Boss

          Nuestro jefe tendrá un comportamiento simple, que se mantendrá a caminar hacia adelante y hacia atrás y disparar bolas de fuego. Si el jugador toca el jefe, que siempre va a morir. Para el comportamiento jefe vamos a repetir muchas cosas que usamos en otras casas prefabricadas, así que no dude puede cambiar el código para la repetición de código de evitar, pero lo guardaré repite aquí para simplificar el tutorial.
          var Platformer = Platformer || {}; Platformer.Boss = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (esto, game_state, la posición, propiedades); this.attack_rate = + properties.attack_rate; this.attack_speed = + properties.attack_speed; this.walking_speed = + properties.walking_speed; this.walking_distance = + properties.walking_distance; // guardar x anteriores para realizar un seguimiento de la distancia caminado this.previous_x = this.x; this.game_state.game.physics.arcade.enable (this); this.body.velocity.x = properties.direction * this.walking_speed; this.anchor.setTo (0,5); // jefe será siempre atacando this.attack_timer = this.game_state.game.time.create (); this.attack_timer.loop (Phaser.Timer.SECOND / this.attack_rate, this.shoot, este); this.attack_timer.start ();}; Platformer.Boss.prototype = Object.create (Platformer.Prefab.prototype); Platformer.Boss.prototype.constructor = Platformer.Boss; Platformer.Boss.prototype.update = function () { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); // si caminado la distancia máxima, cambiar la velocidad, pero no la escala si (Math.abs (this.x – this.previous_x)> = this.walking_distance) {this.body.velocity.x * = -1; this.previous_x = this.x; }}; Platformer.Boss.prototype.shoot = function () { «utilizar estricta»; // funciona del mismo modo lanzamiento del jugador, pero el uso de un grupo de la piscina diferentes var bola de fuego, fireball_position, fireball_properties; bola de fuego = this.game_state.groups.enemy_fireballs.getFirstDead (); fireball_position = new Phaser.Point (this.x, this.y); Si {fireball_properties = { «textura»: «fireball_image», «grupo»: «enemy_fireballs», «dirección»: «izquierda», «velocidad»: (bola de fuego!) this.attack_speed}; bola de fuego = new Platformer.Fireball (this.game_state, fireball_position, fireball_properties); } Else {fireball.reset (fireball_position.x, fireball_position.y); fireball.body.velocity.x = -this.attack_speed; }}; 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253varPlatformer = Platformer || {}; Platformer.Boss = function (game_state, posición, propiedades) { «utilizar estricta»; Platformer.Prefab.call (Esto, game_state, posición, propiedades); this.attack_rate = + inmuebles .attack_rate; this.attack_speed = + properties.attack_speed; this.walking_speed = + properties.walking_speed; this.walking_distance = + properties.walking_distance; // ahorro x anterior para realizar un seguimiento de caminado distancethis.previous_x = this.x; esto. game_state.game.physics.arcade.enable (this); this.body.velocity.x = properties.direction * this.walking_speed; this.anchor.setTo (0,5); // jefe será siempre attackingthis.attack_timer = esto. game_state.game.time.create (); this.attack_timer.loop (Phaser.Timer.SECOND / this.attack_rate, this.shoot, este); this.attack_timer.start ();}; Platformer.Boss.prototype = Object .Create (Platformer.Prefab.prototype); Platformer.Boss.prototype.constructor = Platformer.Boss; Platformer.Boss.prototype.update = functi en () { «utilizar estricta»; this.game_state.game.physics.arcade.collide (esto, this.game_state.layers.collision); // si caminado la distancia máxima, cambiar la velocidad, pero no el scaleif (Matemáticas .abs (this.x-this.previous_x)> = this.walking_distance) {this.body.velocity.x * = – 1; this.previous_x = this.x;}}; Platformer.Boss.prototype.shoot = function () { «uso estricto»; // funciona de la misma manera disparar jugador, pero utilizando un groupvarfireball diferente piscina, fireball_position, fireball_properties; bola de fuego = this.game_state.groups.enemy_fireballs.getFirstDead (); fireball_position = newPhaser.Point (esto. x, this.y), si (bola de fuego) {fireball_properties = { «textura»: «fireball_image», «grupo»: «enemy_fireballs», «dirección»: «izquierda», «velocidad»: this.attack_speed}; bola de fuego = newPlatformer.Fireball (this.game_state, fireball_position, fireball_properties);} else {fireball.reset (fireball_position.x, fireball_position.y); fireball.body.velocity.x = -this.attack_speed;}};

          Para hacer que el movimiento Boss, lo haremos como el movimiento del enemigo, la única diferencia es que nosotros no va a cambiar la escala jefe sprite, de esta manera se buscará siempre en la misma dirección. Cabe recordar que vamos a guardar la posición inicial antes del inicio de Boss movimiento y, cuando se haya desplazado una cantidad máxima distancia que invertir su velocidad y actualizar la posición inicial.

          Los ataques de Boss se hará igual que el jugador bolas de fuego, excepto vamos a cambiar el grupo sea “enemy_fireballs” y no tiene que comprobar si la dirección jefe, ya que es siempre la misma. Tenga en cuenta que usamos la misma bola de fuego prefabricada y, ya que estamos cambiando el grupo, no va a chocar con otros enemigos, y que no tiene que crear una nueva prefabricada para el ellos.

          Por último, podemos ver nuestro jefe en el juego, y el nivel de jefe es completa:

          jefe

          Acabado del juego

          Ahora, puede agregar el nuevo contenido a los otros niveles como desee, y terminar de jugar. We added a lot of content to our game and I would like to know your opinion of the final result, and what kind of game you would like to see in the next tutorials.

          Mensajes relacionados
          HTML5 Game Development with Phaser

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *