Añadiendo una nueva capa
De acuerdo, ahora queremos añadir algunos objetos nuevos. Sin embargo, primero vamos a estar seleccionando el fondo sin quererlo, a menos que lo bloqueemos (lock), haciéndolo inseleccionable. Vamos a usar el sistema de capas para hacerlo.
Los lienzos (layouts) pueden consistir en multiples capas layers, que puedes usar para agrupar objetos. Piensa en las capas como en hojas de cristal puestas una encima de otra, con objetos pintados en cada hoja. Esto te permite fácilmente organizar los objetos que aparecen encima de otros, además las capas pueden ocultarse, bloquearse, aplicarles efecto de parallax y otros. Por ejemplo, en este juego, queremos que todo se muestre por encima del fondo, así que podemos crear otra capa para nuestros objetos.
[N. del T.:
parallax puede traducirse como paralaje o desplazamiento diferencial. Por ejemplo permite que el usuario vea varios fondos superpuestos desplazándose a diferentes velocidades.]
Para administrar las capas, haz click en la pestaña Layers Layers tab, que normalmente está junto a la pestaña de Proyecto Proyect bar.
Debes estar viendo la capa 0 Layer 0 en el listado (Construct2 cuenta desde cero, porque así trabaja mejor, como en programación). Haz click en el icono del lápiz y renombra la capa a Background, ya que es nuestra capa de fondo. Ahora haz click en el icono + 'add layer at top' para añadir una nueva capa para nuestros objetos. Vamos a llamarla Main. Finalmente, si haces click en el pequeño icono del candado al lado de Background, esta capa se bloquea. Lo que significa que no se podrá seleccionar nada que haya en ella. Esto es muy conveniente para nuestro fondo de azulejos (que puede ser fácilmente seleccionado sin querer) que no necesita volver a ser modificado. De todos modos, si necesitaras hacer cambios, sólo tienes que hacer click en el icono del candado otra vez para desbloquearla.
Las casillas de checkbox te permiten ocultar las capas en el editor, pero no necesitamos hacer esto de momento. Tus capas deberían verse así:
Ahora, asegutate de que la capa 'Main' está seleccionada en la barra de capas. Esto es importante - la capa seleccionada es la capa activa. Todos los objetos nuevos que se insertan se insertan en la capa activa, así que si no está seleccionada, podríamos insertar accidentalmente los objetos en una capa equivocada. La capa activa se muestra en la barra de estado, además se muestra en un tooltip cuando colocamos un nuevo objeto - merece la pena echarle un ojo a esto.
Añadiendo tiles*
[N. del T.: Tiles se debe traducir como azulejo o baldosa en castellano, pero aquí se refiere a las piezas que juntas te permiten formar una plataforma (lo veréis claramente en las imágenes). Como no me parecía muy correcto llamar a esto "azulejo" he decidido dejarlo como tile, que hace más referencia a una pieza de mosaico. Si alguien no está de acuerdo, por favor, editen la traducción.]
El paquete Jungler Platformer tiene un set de tiles en la carpeta Tiles\Tiles.png. vamos a importarlos como un objeto sprite y usarlo como un objeto tile.
Como hicisteis con el fondo baldosado*, doble-click y en algún punto del layout e insertais el nuevo objeto. Esta vez escoger Sprite. El ratón se transforma en una cruceta de nuevo. Hacer click en algún lugar en el centro de la pantalla.
El Editor de Imágenes se abre, con algunas ventanas extras, porque los Sprites pueden ser animados. De todos modos, nosotros no vamos a ejecutar la animación (su velocidad será 0). Lo que vamos a hacer es poner un tile diferente en cada frame (fotograma) de la animación. Entonces podremos modificar el tile que se muestra simplemente cambiando el frame de la animación.
Click derecho en algún punto de animation frames en el panel de abajo, y selecciona Import sprite strip.... Esto nos permite cortar imágenes para las animaciones, que también sirve para los mapas de tiles.
Se abre el dialogo de apertura de archivo. Selecciona el archivo Tiles\Tiles.png del paquete de sprites. Construct 2 necesita saber cuantos tiles hay en la imagen. Te habrás dado cuenta que Tiles.png" es una regilla de 12x12 tiles. Introduce 12 y 12* y haz click en OK.
Dale a Construct 2 un momento para cortar los tiles. Ahora deberías tener los 144 tiles importados como frames de animación!!. No necesitamos el primer frame vacío durante más tiempo, así que click derecho en él y selecciona delete
Querrás cambiar el tamaño de la ventana Animation Frames y hacerla más grande para ver mejor tus tiles. Además, puedes hacer click derecho en un lugar y cambiar el tamaño de las miniaturas (thumbnails) a Large si prefieres miniaturas más grandes.
Por defecto la velocidad de la animación es 5, lo que significa que los tiles irán cambiando. Pero queremos que los tiles se queden quietos en su frame, así que asegurémonos de que la velocidad de animación sea 0. Selecciona animación Default en la ventana Animations.
La barra de propiedades ahora te muestra las propiedades de la animación. Pon la propiedad Speed (velocidad) en 0.
Ahora los tiles no irán cambiando de imagen, se quedan en el mismo frame. Cierra el editor de imagen haciendo click en la X de una de las tres ventanas flotantes. Tu Sprite tile ahora debe estar en el layout!!
Con el objeto seleccionado, cámbiale el nombre de Sprite a Tile en la barra de propiedades. Es buena idea dar a los objetos un nombre apropiado.
Creando un escenario con tiles
Date cuenta que el objeto Sprite tiene una propiedad llamada Initial frame. Podemos usarla para ir cambiado de tile. Selecciona el objeto Tile y cambia su initial frame a 1:
Notarás que la imagen cambia para mostrarnos el tile que hay en el frame 1 de la animación. Así es como podemos ir poniendo diferentes tiles en nuestro escenario.
Manten Control y haz click y arrastra el tile. Crearás otro objeto tile. Hazlo de nuevo y tendrás tres tiles en fila. Selecciona el tile del medio y pon su *initial frame en 10. Haz lo mismo para el de la derecha, pero haz que su initial frame sea el 13. Ahora debes tener algo similar a esto:
Si te preguntas como saber que numero de frame corresponde a cada tile, simplemente haz doble click en el objeto tile. El editor de imagen se abre de nuevo con la ventana de animación donde puedes comprobarlo. Recuerda que puedes hacer control y arrastrar en un tile para duplicarlo, y así no tener que escribir su initial frame.
Habilitando Ajustar a rejilla (snap to grid)
Alinear los tiles a mano puede ser un dolor de cabeza!. Puedes habilitar la rejilla para hacerlo más facilmente. En la barra superior, haz click en View y habilita Snap to Grid. La rejilla por defecto tiene un tamaño de 32x32, lo cual está bien. Nuestros tiles son de 128x128 que es múltiplo de 32. Esto nos hará más sencillo ajustar los tiles uno al lado del otro y nos sigue dando cierta libertad de posicionamiento.
Intenta arrastrar los tiles ahora. Notarás que se ajustan a una rejilla de 32x32. Ahora debe ser sencillo ajustar tres tiles juntos