Читать книгу Aprender desarrollo de videojuegos para móviles y web con Phaser.js - Pablo Monteserín - Страница 23

Lo que hemos hecho en el código anterior es:

• Dentro del método preload:

1. Redimensionamos el área de juego para que ocupe el 100% de la pantalla del dispositivo.

2. Añadimos un listener que escuche constantemente cuando redimensionamos la pantalla, para, en caso de hacerlo, volver a llamar al método resize que volverá a redimensionar la pantalla.

3. Precargamos las cuatro imágenes que pondremos en pantalla cuando llamemos al método create. En este caso, precargamos las imágenes fondo, caraIMG0, caraIMG1 y caraIMG2. También vamos a precargar caraIMG3, ya que más adelante la utilizaremos cuando carguemos las imágenes inferiores de manera aleatoria. Tenga en cuenta que aunque, por ejemplo, caraIMG0 identificará al recurso gráfico que hemos cargado, no tiene por qué coincidir con el nombre de la foto.

• Dentro del método create:

1. La primera línea se encarga de colocar en pantalla la imagen de fondo del juego.

2. Las tres siguientes colocan en pantalla las imágenes correspondientes a caraIMG0, caraIMG1 y caraIMG2.

3. Los tamaños con los que se habrán insertado estas imágenes en pantalla son demasiado grandes. Esto es porque las imágenes que le he pasado tienen un tamaño pensado para la televisión de arriba y no para las tres televisiones de abajo. Por tanto, habrá que redimensionarlas para ajustarlas a las televisiones inferiores llamando al método setScale.

Aprender desarrollo de videojuegos para móviles y web con Phaser.js con 100 ejercicios prácticos

015