Continuamos el tutorial de Tiled donde lo dejamos. Seguro que has dibujado un bonito mapa con ese tileset, puedes enseñarnos la foto en los comentarios y la pondré. Ahora avanzamos a las capas. Si has trabajado con alguno programa de diseño (Photoshop, GIMP, AutoCAD,...), seguro que ya conoces lo básico de las capas.
Las capas son submapas que comparten el mismo espacio que el mapa final y que al superponerse forman el mapa final. Por ejemplo, una capa pueden ser Paredes y otra Ventanas. En la capa de las paredes tenemos las paredes de un edificio solo eso. Encima de esa capa ponemos otra, solo con ventanas. Cuando combinemos ambas capas veremos como las ventanas se dibujan encima de las paredes ya dibujadas. Además las capas pueden estar desactivadas, eso significa que sus datos están pero ya no forman parte del mapa final. Luego vía programación las podemos activar/desactivar a nuestro gusto. En Tiled además cada capa puede tener atributos distintos.
Por defecto en Tiled tenemos ya una capa. Vamos a borrarla para empezar de cero. Las capas se encuentran arriba a la derecha.
- Capa de Imagen. Es usada para poner una imagen de fondo. En juego de plataformas es una muy buena opción.
- Capa de Objetos. Los objetos son figuras geométricas ajenas a las celdas. No las vamos a usar de momento.
- Capa de Patrones. Estas son las básicas. Permiten poner elementos del tileset dentro de la rejilla. </ul> Vamos a crear dos capas de patrones. Una se va a llamar Paredes y la otra será Suelo. El orden de las capas es importante. Las que están más arriba se aplican más tarde. En este caso Paredes debe ir por encima de suelo, aunque en este ejemplo no afectará mucho lo contrario. Con la capa Suelo seleccionada, cogemos la cubeta y pintamos el suelo. Ahora nos cambiamos a Paredes y dibujamos algunas paredes. Como ves, se pintan por encima del suelo. Si tratas de borrar el suelo verás que es imposible, tienes que cambiar antes a la capa Suelo.
Añadiendo atributos a las capas en Tiled
Imagina ahora un juego. Normalmente serás capaz de caminar por el suelo pero serás bloqueado por las paredes. ¿Cómo indicamos a Tiled que una capa tiene propiedad distinta que otra? Con atributos. Podemos especificar que en una capa el personaje no puede caminar (porque es una pared, por ejemplo) o que sí pueda hacerlo. Los detalles de la implementación se programarán en Phaser pero podemos indicar los datos con las propiedades de cada capa. En la parte izquierda está la pestaña Atributos personalizados. Le damos al botón + abajo. Nos pedriá un nombre del atributo y un tipo. Nombre puede ser pasable y el tipo será bool. Es decir, solo puede ser verdadero o falso. Hacemos lo mismo con la otra capa y en la capa Suelo marcamos la opción como verdadera.