En el último tutorial añadió el entrenador y diferentes especies de Pokemon en nuestro juego. Ahora vamos a limitar el número de pokeballs para el jugador, y añadir diferentes tipos de Pokeball con diferentes tasas de captura. Para conseguir nuevos pokeballs el jugador tendrá que interactuar con pokestops. Los siguientes temas serán cubiertos en este tutorial:


  • La limitación del número de pokeballs
  • La adición de diferentes tipos de Pokeball con diferentes tasas de captura
  • Adición pokestops donde el jugador puede recoger pokeballs
  • Adición de una pantalla de título

    Para leer este tutorial, es importante que usted está familiarizado con los conceptos siguientes:


    • Javascript y conceptos orientados a objetos.
    • conceptos básicos Phaser, tales como: estados, sprites, los grupos y la física de arcade
    • Creación de mapas con baldosa

      Tabla de contenidos

      convertirse en un desarrollador de juegos mediante la construcción de 15 juegos

      Si usted quiere dominar Phaser y aprender cómo publicar juegos Phaser como juegos nativas para iOS y Android se sienten libres para comprobar Zenva En línea En este supuesto The Complete el juego para móvil Curso de Desarrollo – Construir 15 juegos.

      archivos de código fuente

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

      limitación del número de pokeballs

      La primera cosa a limitar el número de pokeballs se está iniciando en main.js. Ya que será utilizada por diferentes estados de juego, vamos a guardarlo en el objeto del juego.
      var Pokemon = Pokemon || {}; Var juego = new Phaser.Game (320, 640, Phaser.CANVAS); game.caught_pokemon = []; game.number_of_pokeballs = 0; game.state.add ( «BootState», nuevo Pokemon.BootState ()) ; game.state.add ( «LoadingState», nuevo Pokemon.LoadingState ()); game.state.add ( «TitleState», nuevo Pokemon.TitleState ()); game.state.add ( «WorldState», nuevo Pokemon. WorldState ()); game.state.add ( «CatchState», nueva Pokemon.CatchState ()); game.state.start ( «BootState», verdadero, falso, «activos / niveles / title_screen.json», «TitleState» ); 1234567891011121314varPokemon = Pokemon || {}; vargame = newPhaser.Game (320640, Phaser.CANVAS); game.caught_pokemon = []; game.number_of_pokeballs = 0; game.state.add ( «BootState», newPokemon.BootState ( )); game.state.add ( «LoadingState», newPokemon.LoadingState ()); game.state.add ( «TitleState», newPokemon.TitleState ()); game.state.add ( «WorldState», newPokemon.WorldState ()); game.state.add ( «CatchState», newPokemon.CatchState ()); game.state.start ( «BootState», verdadero, falso, «activos / niveles / title_screen.json», «TitleState»);

      Ahora, en el que CatchState quiere mostrar el número actual de pokeballs por debajo de la Pokeball prefabricada. Podemos hacer eso mediante la creación de un TextPrefab por debajo de la Pokeball, y el establecimiento de su texto a ser el número actual de pokeballs. Esto se realiza en el extremo del constructor de la Pokeball prefabricada.
      text_position = nuevo Phaser.Point (this.x, this.y + this.height * 0,7); this.number_of_pokeballs_text = new Pokemon.TextPrefab (this.game_state, «number_of_pokeballs», text_position, this.TEXT_PROPERTIES); this.number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs; 123text_position = newPhaser.Point (this.x, this.y + this.height * 0,7); this.number_of_pokeballs_text = newPokemon.TextPrefab (this.game_state, «number_of_pokeballs» , text_position, this.TEXT_PROPERTIES); this.number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs;

      Tenemos que mantener este texto actualizado. Así, después de lanzar una Pokeball tenemos que disminuir el número de pokeballs y actualizar el texto.
      Pokemon.Pokeball.prototype.throw = function () { «utilizar estricta»; distance_to_initial_position var; // parada draggin la this.dragging pokeball = false; // tirar la pokeball si la distancia a la posición inicial está por encima del umbral distance_to_initial_position = new Phaser.Point (this.x – this.initial_position.x, this.y – this.initial_position.y); si (distance_to_initial_position.getMagnitude ()> this.THROW_THRESHOLD) {this.game_state.game.number_of_pokeballs – = 1; this.number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs; distance_to_initial_position.normalize (); // inicializar el this.init_body cuerpo físico pokeball (); this.body.velocity.x = -distance_to_initial_position.x * this.pokeball_speed; this.body.velocity.y = -distance_to_initial_position.y * this.pokeball_speed; } Else {this.reset (this.initial_position.x, this.initial_position.y); }}; 123456789101112131415161718192021Pokemon.Pokeball.prototype.throw = function () { «utilizar estricta»; vardistance_to_initial_position; // parada draggin la pokeballthis.dragging = false; // tirar la pokeball si la distancia a la posición inicial está por encima del thresholddistance_to_initial_position = newPhaser.Point (this.x-this.initial_position.x, this.y-this.initial_position.y), si (distance_to_initial_position.getMagnitude ()> this.THROW_THRESHOLD) {this.game_state.game.number_of_pokeballs- = 1; esta .number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs; distance_to_initial_position.normalize (); // inicializar la bodythis.init_body física pokeball (); this.body.velocity.x = -distance_to_initial_position.x * this.pokeball_speed; esto. body.velocity.y = -distance_to_initial_position.y * this.pokeball_speed;} else {this.reset (this.initial_position.x, this.initial_position.y);}};

      Además, si el Pokémon no es capturado después de tirar la Pokeball, hemos restablecido el Pokeball a su posición inicial. Vamos a reemplazar el método de reinicio también comprobar si esto era el último Pokeball. Si es así, tenemos que volver a WorldState.
      Pokemon.Pokeball.prototype.reset = función (x, y) { «utilizar estricta»; Phaser.Sprite.prototype.reset.call (esto, x, y); si (this.game_state.game.number_of_pokeballs === 0) {this.game_state.return_to_world (); }}; 12345678Pokemon.Pokeball.prototype.reset = función (x, y) { «utilizar estricta»; Phaser.Sprite.prototype.reset.call (esto, x, y); si (this.game_state.game.number_of_pokeballs = == 0) {this.game_state.return_to_world ();}};.

      Antes de continuar hay que cambiar la PokemonSpawn prefabricada para iniciar CatchState solamente si el número actual de pokeballs es mayor que cero
      Pokemon.PokemonSpawn.prototype.try_catching = function () { «utilizar estricta»; // iniciar CatchState si (this.game_state.game.number_of_pokeballs> 0) {this.game_state.game.state.start ( «BootState», verdadero, falso, «activos / niveles / catch_level.json», «CatchState», { pokemon_properties: this.pokemon_properties}); }}; 1234567Pokemon.PokemonSpawn.prototype.try_catching = function () { «uso estricto»; // iniciar CatchStateif (this.game_state.game.number_of_pokeballs> 0) {this.game_state.game.state.start ( «BootState», verdadero, falso, «activos / niveles / catch_level.json», «CatchState», {pokemon_properties: this.pokemon_properties});}};

      Por ahora se puede tratar de juego y comprobando si CatchState está mostrando el número actual de pokeballs . Trate de perder todas las pokeballs para ver si se vuelve a WorldState. También, intente hacer clic en un PokemonSpawn sin pokeballs.

      number_of_pokeballs

      Adición de diferentes tipos de pokeball

      Ahora que estamos limitando el número de pokeballs, vamos a añadir diferentes tipos de Pokeball.

      En primer lugar, vamos a cambiar el número de pokeballs ser un objeto con tres diferentes tipos de Pokeball:. Pokeball, greatball y Ultraball
      game.number_of_pokeballs = this.game.number_of_pokeballs || {Pokeball: 0, greatball: 1, Ultraball: 2}; 1game.number_of_pokeballs = this.game.number_of_pokeballs || {pokeball: 0, greatball: 1, Ultraball: 2};

      Las otras partes de código que utilizan este también es necesario cambiar variable.

      Por ejemplo, en el PokemonSpawn prefabricadas tenemos que comprobar si la suma de todas las pokeballs es mayor que cero.
      Pokemon.PokemonSpawn.prototype.try_catching = function () { «utilizar estricta»; // iniciar CatchState si (this.game_state.game.number_of_pokeballs.pokeball + + this.game_state.game.number_of_pokeballs.greatball this.game_state.game.number_of_pokeballs.ultraball> 0) {this.game_state.game.state.start (» BootState», verdadero, falso, «activos / niveles / catch_level.json», «CatchState», {pokemon_properties: this.pokemon_properties}); }}; 123456789Pokemon.PokemonSpawn.prototype.try_catching = function () { «use strict»; // iniciar CatchStateif (this.game_state.game.number_of_pokeballs.pokeball + + this.game_state.game.number_of_pokeballs.greatball this.game_state.game .number_of_pokeballs.ultraball> 0) {this.game_state.game.state.start ( «BootState», verdadero, falso, «activos / niveles / catch_level.json», «CatchState», {pokemon_properties: this.pokemon_properties});} };

      En la Pokeball prefabricadas tenemos que añadir una propiedad “tipo”. Esta propiedad se utiliza para acceder al objeto “number_of_pokeballs”. Además, ahora en el método de “reinicio” vamos a volver a WorldState sólo si la suma de todas las pokeballs es cero. Si el jugador está fuera de sólo el Pokeball actual, cambiamos su alfa a 0,5.
      this.type = properties.type; this.number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs [this.type]; si (this.game_state.game.number_of_pokeballs [this.type] === 0) {this.alpha = 0,5;} 1234567this.type = properties.type; this.number_of_pokeballs_text.text = this.game_state.game.number_of_pokeballs [this.type]; si (this.game_state.game.number_of_pokeballs [this.type] === 0) {this.alpha = 0,5;} Pokemon.Pokeball.prototype.reset = función (x, y) { «utilizar estricta»; Phaser.Sprite.prototype.reset.call (esto, x, y); si (this.game_state.game.number_of_pokeballs [this.type] === 0) {this.alpha = 0,5; } If (this.game_state.game.number_of_pokeballs.pokeball + this.game_state.game.number_of_pokeballs.greatball + this.game_state.game.number_of_pokeballs.ultraball === 0) {this.game_state.return_to_world (); }}; 1234567891011121314Pokemon.Pokeball.prototype.reset = función (x, y) { «utilizar estricta»; Phaser.Sprite.prototype.reset.call (esto, x, y); if (this.game_state.game.number_of_pokeballs [ this.type] === 0) {this.alpha = 0,5;} if (this.game_state.game.number_of_pokeballs.pokeball + this.game_state.game.number_of_pokeballs.greatball + this.game_state.game.number_of_pokeballs.ultraball == = 0) {this.game_state.return_to_world ();}};

      Ahora, en el archivo de nivel CatchState (catch_level.json) vamos a añadir los tres tipos de Pokeball, cada uno con su propio “tipo” y propiedades “catching_rate”. Además, vamos a añadir una casa prefabricada botón llamado “switch_pokeball”, que llamar a un método “switch_pokeball” en CatchState.
      «Pokeball»: { «type»: «pokeball», «posición»: { «x»: 0,5, «Y»: 0,8}, «propiedades»: { «textura»: «pokeball_image», «grupo»: «pokeballs «, «ancla»: { «x»: 0,5, «y»: 0,5}, «pokeball_speed»: 300, «catching_rate»: 0,5, «type»: «pokeball»}}, «greatball»: { «tipo» : «pokeball», «posición»: { «x»: 0,5, «y»: 0,8}, «propiedades»: { «textura»: «greatball_image», «grupo»: «pokeballs», «de anclaje»: {» x «: 0,5, «y»: 0,5}, «pokeball_speed»: 300, «catching_rate»: 0,75, «type»: «greatball»}}, «Ultraball»: { «type»: «pokeball», «posición» : { «x»: 0,5, «y»: 0,8}, «propiedades»: { «textura»: «ultraball_image», «grupo»: «pokeballs», «de anclaje»: { «x»: 0,5, «y» : 0.5}, «pokeball_speed»: 300, «catching_rate»: 0,9, «tipo»: { «type»:: «botón», «posición»: «switch_pokeball» «Ultraball»}} { «x»: 0,5, «y»: 0,95}, «propiedades»: { «textura»: «pokeball_image», «grupo»: «HUD», «ancla»: { «x»: 0,5, «y»: 0,5}, «escala»: { «x»: 0,4, «y»: 0,4}, «devolución de llamada»: «switch_pokeball»}} 123456789101112131415161718192021222324252627282930313 2333435363738394041424344454647 «pokeball»: { «type»: «pokeball», «posición»: { «x»: 0,5, «y»: 0,8}, «propiedades»: { «textura»: «pokeball_image», «grupo»:» pokeballs » «de anclaje»: { «x»: 0,5, «y»: 0,5}, «pokeball_speed»: 300, «catching_rate»: 0,5, «type»: «pokeball»}}, «greatball»: {» tipo «:» pokeball», «posición»: { «x»: 0,5, «y»: 0,8}, «propiedades»: { «textura»: «greatball_image», «grupo»: «pokeballs», «de anclaje»: { , «y» 0.5:: 0.5}, «pokeball_speed»: 300, «catching_rate»: 0,75, «type»: «greatball»}}, «Ultraball»: { «type»: «pokeball», «posición «x» «: {» x «: 0,5,» y «: 0,8},» propiedades «: {» textura «:» ultraball_image » «grupo»: «pokeballs», «de anclaje»: { «x»: 0,5,» y «: 0,5},» pokeball_speed «: 300,» catching_rate «: 0,9,» type «:» Ultraball «}},» switch_pokeball «: {» type «:» botón», «posición»: { «x»: 0,5 , «y»: 0,95}, «propiedades»: { «textura»: «pokeball_image», «grupo»: «HUD», «ancla»: { «x»: 0,5, «y»: 0,5}, «escala» : { «x»: 0.4 «y»: 0,4}, «devolución de llamada»: «switch_pokeball»}}

      Ahora tenemos que aplicar la lógica para pokeballs interruptor. En primer lugar, vamos a añadir un método de “activar” a la Pokeball prefabricada. Este método será llamado cuando la conmutación de una pokeball, y va a cambiar las propiedades “visible”, “inputEnabled” y “checkWorldBounds”. La idea es hacer una Pokeball visible si es la actual. Además, tenemos que permitir a sus eventos sólo si su el actual y el número de pokeballs de su tipo es mayor que cero. Por defecto, todos los pokeballs están deshabilitados en el constructor.
      Pokemon.Pokeball.prototype.enable = función (activar) { «utilizar estricta»; = This.visible permiten; = This.inputEnabled permiten && (this.game_state.game.number_of_pokeballs [this.type]> 0); this.checkWorldBounds = permiten && (this.game_state.game.number_of_pokeballs [this.type]> 0); = This.number_of_pokeballs_text.visible permiten;}; 1234567Pokemon.Pokeball.prototype.enable = función (activar) { «utilizar estricta»; = this.visible permiten; = this.inputEnabled permiten && (this.game_state.game.number_of_pokeballs [esto. tipo]> 0); this.checkWorldBounds = permiten && (this.game_state.game.number_of_pokeballs [this.type]> 0); = this.number_of_pokeballs_text.visible permiten;};

      Finalmente, tenemos que aplicar la “switch_pokeball ”método en CatchState. Pero en primer lugar, en el final del método “crear” vamos a añadir una matriz con los tipos pokeball y una variable con el índice de la actual. A continuación, hacemos posible que la primera Pokeball.
      this.pokeball_types = [ «pokeball», «greatball», «Ultraball»]; this.current_pokeball_index = 0; . This.prefabs [this.pokeball_types [this.current_pokeball_index]] Activa (true); 123this.pokeball_types = [ «pokeball», «greatball», «Ultraball»]; this.current_pokeball_index = 0; this.prefabs [this.pokeball_types . [this.current_pokeball_index]] Activa (true);.

      Ahora el método de “switch_pokeball” simplemente desactivar el pokeball actual, incrementa el índice (limitado por la “pokeball_types” tamaño de la matriz) y permitir la siguiente pokeball
      Pokemon.CatchState.prototype.switch_pokeball = function () { «utilizar estricta»; . This.prefabs [this.pokeball_types [this.current_pokeball_index]] permiten (false); this.current_pokeball_index = (this.current_pokeball_index + 1)% this.pokeball_types.length; . This.prefabs [this.pokeball_types [this.current_pokeball_index]] permiten (true);}; 123456Pokemon.CatchState.prototype.switch_pokeball = function () { «utilizar estricta»; this.prefabs [this.pokeball_types [this.current_pokeball_index] ] .enable (false); this.current_pokeball_index = (this.current_pokeball_index + 1)% this.pokeball_types.length;. this.prefabs [this.pokeball_types [this.current_pokeball_index]] permiten (true);};

      Por ahora usted puede intentar jugar y cambiar pokeballs. Tenga en cuenta que cada tipo Pokeball tiene su propia textura, para que pueda ver fácilmente que están cambiando.

      types_of_pokeball

      Adición pokestops

      El siguiente paso es la adición de pokestops donde el jugador puede recoger nuevas pokeballs.

      Por lo tanto, vamos a empezar por la creación de una casa prefabricada Pokestop. En el constructor que necesitamos para salvar sus propiedades, tales como “reset_time” y “detection_radius”. También vamos a añadir un evento de entrada a pokeballs recoger y crear un temporizador de reposición, el cual será enviado después de cada evento de entrada.
      Pokemon.Pokestop = function (game_state, nombre, posición, propiedades) { «utilizar estricta»; text_position var; Pokemon.Prefab.call (esto, game_state, nombre, posición, propiedades); this.INITIAL_POKEBALL_POSITION = new Phaser.Point (this.game_state.game.width – 50, 50); this.POKEBALL_TIME = 2; this.reset_time = + properties.reset_time; this.detection_radius = + properties.detection_radius; this.events.onInputDown.add (this.get_pokeballs, this); this.reset_timer = this.game_state.game.time.create (false);}; 123456789101112131415Pokemon.Pokestop = function (game_state, nombre, posición, propiedades) { «utilizar estricta»; vartext_position; Pokemon.Prefab.call (esto, game_state , nombre, posición, propiedades); this.INITIAL_POKEBALL_POSITION = newPhaser.Point (this.game_state.game.width-50,50); this.POKEBALL_TIME = 2; this.reset_time = + properties.reset_time; this.detection_radius = + inmuebles .detection_radius; this.events.onInputDown.add (this.get_pokeballs, este); this.reset_timer = this.game_state.game.time.create (falso);};

      el método “actualizar” comprobará si el entrenador está cerca de la pokestop, de manera similar a lo que hicimos con el PokemonSpawn. La única diferencia es que ahora sólo vamos a cambiar el “inputEnabled” propiedad, y el pokestop será siempre visible.
      Pokemon.Pokestop.prototype.update = function () { «utilizar estricta»; distance_to_trainer var, trainer_within_detection_radius; distance_to_trainer = this.position.distance (this.game_state.prefabs.trainer.position); trainer_within_detection_radius = distance_to_trainer <= this.detection_radius; this.inputEnabled = trainer_within_detection_radius;}; 1234567Pokemon.Pokestop.prototype.update = function () { "utilizar estricta"; vardistance_to_trainer, trainer_within_detection_radius; distance_to_trainer = this.position.distance (this.game_state.prefabs.trainer.position); trainer_within_detection_radius = distance_to_trainer <= this.detection_radius; this.inputEnabled = trainer_within_detection_radius;};

      los “get_pokeballs” necesidades método para elegir aleatoriamente el tipo y número de pokeballs el jugador va a recoger. Esto será similar a lo que ya estamos haciendo para desovar Pokemon. Así, en primer lugar vamos a mover el código que elegir un Pokémon al azar en el fichero de Utils.js, y lo puso en una función llamada “choose_randomly”. Este método generará un número aleatorio y recoger el primer elemento en una matriz cuya probabilidad es mayor que el número aleatorio generado.
      Pokemon.choose_randomly = función (rnd, probabilidades) { «uso estricto»; var random_number, element_index, elemento; random_number = rnd.frac (); para (element_index = 0; element_index Ahora, el método de “get_pokeballs” simplemente hacer uso de esta función. En primer lugar, vamos a cambiar el matiz pokestop, para demostrar que se ha utilizado. Entonces elegimos al azar un número de pokeballs para desovar, a partir de una matriz que contiene esta probabilidades. Entonces, para cada pokeball se recogió, elegimos al azar su tipo, a partir de otra matriz de probabilidades. Al final desactivamos los eventos de entrada, llamar a un método para mostrar las pokeballs recogidos y despachar el temporizador de restablecimiento.
      Pokemon.Pokestop.prototype.get_pokeballs = function () { «utilizar estricta»; number_of_pokeballs var, pokeball_index, pokeball, pokeballs_to_show; this.tint = 0xff0000; number_of_pokeballs = Pokemon.choose_randomly (this.game_state.rnd, this.game_state.pokeball_probabilities.number_of_pokeballs); pokeballs_to_show = []; para (pokeball_index = 0; pokeball_index el método “show_pokeballs” creará un Phaser.Sprite para cada Pokeball recogida, por lo que el jugador puede ver lo que se recoge. Para cada sprite vamos a añadir un evento que matará a él después de algún tiempo.
      Pokemon.Pokestop.prototype.show_pokeballs = function (pokeballs_to_show) { «utilizar estricta»; var pokeball_index, pokeball_position, pokeball, pokeball_kill_timer; pokeball_position = nuevo Phaser.Point (this.INITIAL_POKEBALL_POSITION.x, this.INITIAL_POKEBALL_POSITION.y); pokeball_kill_timer = this.game_state.game.time.create (); pokeballs_to_show.forEach (function (pokeball_type) {pokeball = new Phaser.Sprite (this.game_state.game, pokeball_position.x, pokeball_position.y, pokeball_type + «_image»); pokeball.anchor.setTo (0,5); pokeball.scale. setTo (0,3); this.game_state.groups.hud.add (pokeball); pokeball_kill_timer.add (this.POKEBALL_TIME * Phaser.Timer.SECOND, pokeball.kill, pokeball); pokeball_position.y + = 1,5 * pokeball.height; }, esta); pokeball_kill_timer.start ();}; 1234567891011121314151617Pokemon.Pokestop.prototype.show_pokeballs = function (pokeballs_to_show) { «utilizar estricta»; varpokeball_index, pokeball_position, pokeball, pokeball_kill_timer; pokeball_position = newPhaser.Point (this.INITIAL_POKEBALL_POSITION.x, this.INITIAL_POKEBALL_POSITION. y); pokeball_kill_timer = this.game_state.game.time.create (); pokeballs_to_show.forEach (function (pokeball_type) {pokeball = newPhaser.Sprite (this.game_state.game, pokeball_position.x, pokeball_position.y, pokeball_type + «_ imagen» ); pokeball.anchor.setTo (0,5); pokeball.scale.setTo (0,3); this.game_state.groups.hud.add (pokeball); pokeball_kill_timer.add (this.POKEBALL_TIME * Phaser.Timer.SECOND, pokeball.kill , pokeball); pokeball_position.y + = 1,5 pokeball.height *;}, this); pokeball_kill_timer.start ();};

      el método “reset_pokestop”, por su vez, simplemente restaurar el valor de tinte, activar los eventos de entrada y detener el “Reset_Timer”.
      Pokemon.Pokestop.prototype.reset_pokestop = function () { «utilizar estricta»; this.inputEnabled = true; this.tint = 0xffffff; this.reset_timer.stop ();}; 123456Pokemon.Pokestop.prototype.reset_pokestop = function () { «utilizar estricta»; this.inputEnabled = true; this.tint = 0xffffff; this.reset_timer.stop ();}; < p> Ahora tenemos que crear las matrices de probabilidades y añadirlos a nuestra “game_state”. Las probabilidades se guardarán en un archivo “pokeball_probabilities.json” como la siguiente. Habrá dos arrays:. Uno para el número de pokeballs y uno para el tipo de cada pokeball
      { «number_of_pokeballs»: [{ «número»: 3, «probabilidad»: 0,2}, { «número»: 2, «probabilidad»: 0,5}, { «número»: 1, «probabilidad»: 1,0}], » type_of_pokeball «: [{» type «: «pokeball», «probabilidad»: 0,5}, {» type «: «greatball», «probabilidad»: 0,8}, {» type «: «Ultraball», «probabilidad»: 1,0 }]} 123456789101112 { «number_of_pokeballs»: [{ «número»: 3, «probabilidad»: 0,2}, { «número»: 2, «probabilidad»: 0,5}, { «número»: 1, «probabilidad»: 1.0 }], «type_of_pokeball»: [{ «type»: «pokeball», «probabilidad»: 0,5}, { «type»: «greatball», «probabilidad»: 0,8}, { «type»: «Ultraball»,» probabilidad «: 1,0}]}

      a continuación, en el‘método de precarga’del WorldState necesitamos cargar este archivo de texto. Además, al final del método “crear” tenemos que analizarlo como un archivo JSON y guardarla en un objeto “pokeball_probabilities”.
      Pokemon.WorldState.prototype.preload = function () { «uso estricto»; this.load.text ( «pokemon_probabilities», this.level_data.pokemon_probabilities); this.load.text ( «pokeball_probabilities», this.level_data.pokeball_probabilities);}; 12345Pokemon.WorldState.prototype.preload = function () { «uso estricto»; this.load.text ( «pokemon_probabilities», this.level_data. pokemon_probabilities); this.load.text ( «pokeball_probabilities», this.level_data.pokeball_probabilities);}; this.pokeball_probabilities = JSON.parse (this.game.cache.getText ( «pokeball_probabilities»)); 1this.pokeball_probabilities = JSON. parse (this.game.cache.getText ( «pokeball_probabilities»));

      a estas alturas, se puede intentar añadir un pokestop en su mapa de baldosa y tratar de recoger algunos pokeballs. Probar diferentes configuraciones de probabilidades para comprobar si su trabajo correctamente. Además, trate de recoger pokeballs cuando el entrenador está demasiado lejos y cuando el pokestop todavía está restableciendo, a ver si funciona.

      pokestop

      Adición de pantalla de título

      Lo último que vamos a añadir es una pantalla de título para nuestro juego. Este será uno muy simple, que sólo mostrará el título del juego y tendrá un evento de entrada para iniciar el juego.

      TitleState también se carga desde un archivo JSON como CatchState. Por lo tanto, vamos a crear un JSONLevelState que será responsable de hacer eso. Entonces, tanto CatchState y TitleState se extenderán ella, solamente se ejecutara las diferentes cosas. El JSONLevelState será sólo se ahorra los datos de nivel, establecer la escala del juego, crear grupos y casas prefabricadas.
      var Pokemon = Pokemon || {}; Pokemon.JSONLevelState = function () { «utilizar estricta»; Phaser.State.call (this); this.prefab_classes = {};}; Pokemon.JSONLevelState.prototype = Object.create (Phaser.State.prototype); Pokemon.JSONLevelState.prototype.constructor = Pokemon.JSONLevelState; Pokemon.JSONLevelState.prototype.init = function (level_data, extra_parameters) { «utilizar estricta»; this.level_data = level_data; this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; this.scale.pageAlignHorizontally = true; this.scale.pageAlignVertically = true;}; Pokemon.JSONLevelState.prototype.create = function () { «utilizar estricta»; var GROUP_NAME, prefab_name, pokemon_data; // crear grupos this.groups = {}; this.level_data.groups.forEach (function (GROUP_NAME) {this.groups [GROUP_NAME] = this.game.add.group ();}, this); // crear prefabricadas this.prefabs = {}; para (prefab_name en this.level_data.prefabs) {if (this.level_data.prefabs.hasOwnProperty (prefab_name)) {// crear prefabricada this.create_prefab (prefab_name, this.level_data.prefabs [prefab_name]); }}}; Pokemon.JSONLevelState.prototype.create_prefab = function (prefab_name, prefab_data) { «utilizar estricta»; prefab_position var, prefabricada; // crear el objeto de acuerdo con su tipo si (this.prefab_classes.hasOwnProperty (prefab_data.type)) {if (prefab_data.position.x> 0 && prefab_data.position.x <= 1) {// posición como porcentaje prefab_position = new Phaser.Point (prefab_data.position.x * this.game.world.width, prefab_data.position.y * this.game.world.height); } Else {// posición como absoluta número prefab_position = prefab_data.position; } = prefabricadas nuevas this.prefab_classes [prefab_data.type] (Esto, prefab_name, prefab_position, prefab_data.properties); } Devolver prefabricada;}; 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960varPokemon = Pokemon || {}; Pokemon.JSONLevelState = function () { "utilizar estricta"; Phaser.State.call (this); this.prefab_classes = {};}; Pokemon.JSONLevelState.prototype = Object.create (Phaser.State.prototype); Pokemon.JSONLevelState.prototype.constructor = Pokemon.JSONLevelState; Pokemon.JSONLevelState.prototype.init = function (level_data, extra_parameters) { "utilizar estricta"; this.level_data = level_data; this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; this.scale.pageAlignHorizontally = true; this.scale.pageAlignVertically = true;}; Pokemon.JSONLevelState.prototype.create = function () { "uso estricto"; vargroup_name, prefab_name , pokemon_data; // crear groupsthis.groups = {}; this.level_data.groups.forEach (function (GROUP_NAME) {this.groups [GROUP_NAME] = this.game.add.group ();}, this); // crear prefabsthis.prefabs = {}; para (inthis.level_data.prefabs prefab_name) {if (this.level_data.prefabs.hasOwnProperty (prefab_name)) {// crear prefabthis.create_prefab (prefab_name, this.level_data.prefabs [prefab_name]);}}}; Pokemon.JSONLevelState.prototype.create_prefab = function (prefab_name, prefab_data) { "utilizar estricta"; varprefab_position, prefabricada; // crear el objeto de acuerdo con su typeif (this.prefab_classes.hasOwnProperty (prefab_data.type)) {if (prefab_data.position.x> 0 && prefab_data.position.x <= 1) {// posición como porcentaje prefab_position = nuevo Phaser.Point ( prefab_data.position.x * this.game.world.width, prefab_data.position.y * this.game.world.height);} else {// posición como numberprefab_position absoluta = prefab_data.position;} prefabricada = newthis.prefab_classes [ prefab_data.type] (esto, prefab_name, prefab_position, prefab_data.properties);} returnprefab;};

      Ahora CatchState solamente implementará su comportamiento específico, tales como: crear el Pokemon prefabricada, controlando el tipo pokeball actual, y volviendo a WorldState.
      var Pokemon = Pokemon || {}; Pokemon.CatchState = function () { «utilizar estricta»; Pokemon.JSONLevelState.call (this); this.prefab_classes = { «fondo»: Pokemon.Prefab.prototype.constructor, «Pokeball»: Pokemon.Pokeball.prototype.constructor, «pokemon»: Pokemon.Pokemon.prototype.constructor, «botón»: Pokemon.Button.prototype .constructor};}; Pokemon.CatchState.prototype = Object.create (Pokemon.JSONLevelState.prototype); Pokemon.CatchState.prototype.constructor = Pokemon.CatchState; Pokemon.CatchState.prototype.init = función (level_data, extra_parameters) { «utilizar estricta»; Pokemon.JSONLevelState.prototype.init.call (Esto, level_data, extra_parameters); // iniciar la física del sistema this.game.physics.startSystem (Phaser.Physics.P2JS); this.game.physics.arcade.gravity.y = 0; this.pokemon_properties = extra_parameters.pokemon_properties;}; Pokemon.CatchState.prototype.create = function () { «utilizar estricta»; pokemon_data var; this.collision_groups = {}; this.level_data.collision_groups.forEach (función (collision_group_name) {this.collision_groups [collision_group_name] = this.game.physics.p2.createCollisionGroup ();}, this); Pokemon.JSONLevelState.prototype.create.call (this); pokemon_data = {tipo: «pokemon», de posición: {x: 0,5, Y: 0,6}, propiedades: this.pokemon_properties} this.create_prefab ( «Pokémon», pokemon_data); this.pokeball_types = [ «pokeball», «greatball», «Ultraball»]; this.current_pokeball_index = 0; . This.prefabs [this.pokeball_types [this.current_pokeball_index]] permiten (true);}; Pokemon.CatchState.prototype.return_to_world = function () { «utilizar estricta»; this.game.state.start ( «BootState», verdadero, falso, «activos / niveles / world_level.json», «WorldState»);}; Pokemon.CatchState.prototype.switch_pokeball = function () { «uso estricto»; . This.prefabs [this.pokeball_types [this.current_pokeball_index]] permiten (false); this.current_pokeball_index = (this.current_pokeball_index + 1)% this.pokeball_types.length; this.prefabs[this.pokeball_types[this.current_pokeball_index]].enable(true);};1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162varPokemon=Pokemon||{};Pokemon.CatchState=function(){«use strict»;Pokemon.JSONLevelState.call(this);this.prefab_classes={«background»:Pokemon.Prefab.prototype.constructor,»pokeball»:Pokemon.Pokeball.prototype.constructor,»pokemon»:Pokemon.Pokemon.prototype.constructor,»button»:Pokemon.Button.prototype.constructor};};Pokemon.CatchState.prototype=Object.create(Pokemon.JSONLevelState.prototype);Pokemon.CatchState.prototype.constructor=Pokemon.CatchState;Pokemon.CatchState.prototype.init=function(level_data,extra_parameters){«use strict»;Pokemon.JSONLevelState.prototype.init.call(this,level_data,extra_parameters);// start physics systemthis.game.physics.startSystem(Phaser.Physics.P2JS);this.game.physics.arcade.gravity.y=0;this.pokemon_properties=extra_parameters.pokemon_properties;};Pokemon.CatchStat e.prototype.create=function(){«use strict»;varpokemon_data;this.collision_groups={};this.level_data.collision_groups.forEach(function(collision_group_name){this.collision_groups[collision_group_name]=this.game.physics.p2.createCollisionGroup();},this);Pokemon.JSONLevelState.prototype.create.call(this);pokemon_data={type:»pokemon»,position:{x:0.5,y:0.6},properties:this.pokemon_properties}this.create_prefab(«pokemon»,pokemon_data);this.pokeball_types=[«pokeball»,»greatball»,»ultraball»];this.current_pokeball_index=0;this.prefabs[this.pokeball_types[this.current_pokeball_index]].enable(true);};Pokemon.CatchState.prototype.return_to_world=function(){«use strict»;this.game.state.start(«BootState»,true,false,»assets/levels/world_level.json»,»WorldState»);};Pokemon.CatchState.prototype.switch_pokeball=function(){«use strict»;this.prefabs[this.pokeball_types[this.current_pokeball_index]].enable(false);this.current_pokeball_index=(this.current_pokeball_index+1)%this.pokeball_types.length;this.p refabs[this.pokeball_types[this.current_pokeball_index]].enable(true);};

      Now, TitleState will simply add an input event in the end of the “create” method. This event will start WorldState, in order to start the game.

      var Pokemon = Pokemon || {};Pokemon.TitleState = function () { «use strict»; Pokemon.JSONLevelState.call(this); this.prefab_classes = { «text»: Pokemon.TextPrefab.prototype.constructor };};Pokemon.TitleState.prototype = Object.create(Pokemon.JSONLevelState.prototype);Pokemon.TitleState.prototype.constructor = Pokemon.TitleState;Pokemon.TitleState.prototype.create = function () { «use strict»; var pokemon_data; Pokemon.JSONLevelState.prototype.create.call(this); this.game.input.onDown.add(this.start_game, this);};Pokemon.TitleState.prototype.start_game = function () { «use strict»; this.game.state.start(«BootState», true, false, «assets/levels/world_level.json», «WorldState»);};1234567891011121314151617181920212223242526varPokemon=Pokemon||{};Pokemon.TitleState=function(){«use strict»;Pokemon.JSONLevelState.call(this);this.prefab_classes={«text»:Pokemon.TextPrefab.prototype.constructor};};Pokemon.TitleState.prototype=Object.create(Pokemon.JSONLevelState.prototype);Pokemon.TitleState.prototype.constructor=Pokemon.TitleState;Pokemon.TitleState.prototype.create=function(){«use strict»;varpokemon_data;Pokemon.JSONLevelState.prototype.create.call(this);this.game.input.onDown.add(this.start_game,this);};Pokemon.TitleState.prototype.start_game=function(){«use strict»;this.game.state.start(«BootState»,true,false,»assets/levels/world_level.json»,»WorldState»);};

      The last thing we have to do is creating the JSON file for TitleState. This level will only have the title message and a start message.

      { «assets»: { }, «groups»: [ «hud» ], «prefabs»: { «title»: { «type»: «text», «position»: {«x»: 0.5, «y»: 0.5}, «properties»: { «anchor»: {«x»: 0.5, «y»: 0.5}, «group»: «hud», «text»: «Phasermon GO», «style»: {«font»: «32px Arial», «fill»: «#FFF»} } }, «start_message»: { «type»: «text», «position»: {«x»: 0.5, «y»: 0.7}, «properties»: { «anchor»: {«x»: 0.5, «y»: 0.5}, «group»: «hud», «text»: «Tap screen to start», «style»: {«font»: «20px Arial», «fill»: «#FFF»} } } }}123456789101112131415161718192021222324252627282930{«assets»:{},»groups»:[«hud»],»prefabs»:{«title»:{«type»:»text»,»position»:{«x»:0.5,»y»:0.5},»properties»:{«anchor»:{«x»:0.5,»y»:0.5},»group»:»hud»,»text»:»Phasermon GO»,»style»:{«font»:»32px Arial»,»fill»:»#FFF»}}},»start_message»:{«type»:»text»,»position»:{«x»:0.5,»y»:0.7},»properties»:{«anchor»:{«x»:0.5,»y»:0.5},»group»:»hud»,»text»:»Tap screen to start»,»style»:{«font»:»20px Arial»,»fill»:»#FFF»}}}}}

      By now you can try playing the game with the title screen, and checking if its’s correctly starting the game.

      title_screen

      And that concludes this tutorial. In the next (and last) one, we are going to save the player pokeballs and caught Pokemon in an online database. Also, we will need to add authentication in order to access the saved data.

      Mensajes relacionados

Deja una respuesta

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