"Move to another Layer"

4
  • 3 favourites

Tagged

Stats

7,129 visits, 8,747 views

Tools

License

This tutorial is licensed under CC BY 4.0. Please refer to the license text if you wish to reuse, share or remix the content contained within this tutorial.

Hola a todos!

Este tutorial esta realizado con que se pueda hacer con la versión Free y está indicado para la gente que lleva poco tiempo en Construct 2, lo que se consigue con este tutorial es un juego de plataformas algo diferente ya que no solo nos movemos por un solo “Layer” o capa, sino que vamos a ser capaces de movernos a otra capa y así imitar un efecto de profundidad o lejanía en tu personaje, para ello utilizaremos el efecto o propieda de capa “parallax”

Empezamos…

1 Creando capas

Creamos un documento nuevo y le agregamos 2 capas más o “Layers”, yo la he llamado:

-Principal

-Lejos

-Fondo

2 Configurando las capas:

En la capa “Principal” nos vamos a la ventana de Propiedades del Layer y lo dejamos tal cual:

(Es importante cambiar la propiedad de Transparente a “Yes”)

En la capa de “Lejos”:

(Es importante cambiar la propiedad de Transparente a “Yes” y también la propiedad Parallax a 80,80… Más adelante lo podréis ajustar a vuestro gusto)

Y por último la capa “Fondo”

La propiedad Parallax a 0,0… La propiedad de Transparente en esta capa es indiferente.)

3 Preparando la escena.

-Creamos un sprite sencillo como este y yo le he puesto el nombre de PlataformaPrincipal donde nos moveremos cuando empecemos el juego.

-Otro sprite sencillo como este y le he puesto el nombre de PlataformaLejos y en esta será cuando nos tele-transportamos a una capa que esta mas lejos.

-Creamos un sprite que será el personaje con este tamaño o “size” 30,55:

-Creamos dos sprites más, donde serán las puertas que al contacto con ellas nos moveremos por las capas de nuestra escena a una la he llamado PuertaPrincipal y a la otra PuertaLejos, las dos con el mismo color (aunque esto da igual porque no se van a ver y vamos a colocar una dibujo de puerta encima de ellas. El tamaño de ellas es:

PuertaPrincipal 20,38

PuertaLejos 11,35

Además le he incluido una variable a cada una de ellas en la ventana de Propiedades de ObjetoInstance Variables:

Para PuertaPrincipal la variable es Puerta=0

Para PuertaLejos la variable es Puerta=1

-Aquí la puerta, podéis poner lo que sea y os guste más:

-Y por último un fondo:

Una vez echo todo esto, deberéis de tener una composición como esta:

4 Dibujando la escena y capas:

Un pequeño consejo o ayuda es que tenéis los botones para bloquear la capa y seleccionar la vista de la capa que queréis ver en la ventana de Layers, para que no os lieis y no os cueste trabajo moveros por las capas ni cambiar ningún sprite por error.

-En la capa Principal yo le he dibujado así:

(Encima del sprite PuertaPrincipal le colocáis el Sprite del dibujo de la Puerta)

-En la capa Lejos la he dibujado así:

(Debajo del Sprite Puerta he colocado el Sprite PuertPrincipal justo donde está la flecha)

-Y por último y colocando el Fondo en la última capa tendríamos esto con las tres vistas activadas:

(Es normal que los sprite de PlataformaPrincipal que están más cercan tapen a las que están más lejos, luego lo solucionamos para que no tapen al personaje cuando este en la capa de “Lejos”)

5 Condiciones y acciones.

¡Vamos a empezar a darle movimiento a nuestro personaje!

Seleccionamos nuestro personaje y en ventana de Propiedades de Objeto le damos el comportamiento o “ Behaviors” Platform, ScrollTo y Flash(¡este último es opcional!)

Seleccionamos nuestras plataformas y a las dos le ponemos el comportamiento o “Behaviors” Solid

Lo demás lo dejamos tal cual.

Ya podemos arrastrar nuestro personaje a la escena y presionando el botón “Run layout”, comprobamos que se puede mover con las teclas de dirección por encima de todas las plataformas las moradas y las verdes.

Nos vamos a la pestaña de “Event sheet1” que se ha creado por defecto junto con el “Layout1” y empezamos a meter las condiciones y acciones correspondiente:

1 En la línea uno ponemos la condición que al comenzar la capa, y como acción ponemos como solido disabled en sprite PlataformaLejos.

Con esta línea ya no se tropezara con las plataformas que están situadas en la capa de “Lejos”. Pulsar el botón “Run layout” y comprobarlo!!

2 En esta línea vamos a meter las siguientes condiciones y acciones:

Un poco de explicación!

Las condiciones son: si, el personaje colisiona con PuertaPrincipal y la variable local de PuertaPricipal es =0 entonces se realizan las acciones.

Acciones:

Mover el personaje a la capa “Lejos”

Poner al personaje en esta posición (50,420)

Poner al personaje con este tamaño de (12,25) así parece que esta lejos!

Poner el comportamiento del sprite PlataformaLejos “Set Solid Enable”

Poner el comportamiento del sprite PlataformaPrincipal “Set Solid Disable”

Variable PuertaPrincipal “Set Puerta =1”

Variable PuertaLejos “Set Puerta =1”

Personaje comportamiento Flash: “Flash 0.3 on 0.1 off 2”

PlataformaPrincipal “Set opacity 90”

Con estas acciones, lo que conseguimos es que cuando toque el personaje la puerta se tele-trasporte a las plataformas que están más lejos y le cambiamos su tamaño, posición donde nos interesa y ponemos la opacidad de las plataformas que están delante a 90 para que sean un poco trasparentes y veamos a nuestro jugador, también cambiamos el valor de las variables para que si colisiona con la PuertaPrincipal no le afecte y realice ninguna acción. Lo del efecto “Flash” no es nada necesario, lo podéis omitir.

Pulsar el botón “Run layout” y comprobar que nos vamos al fondo pero si tocamos la puerta de arriba no hace nada, y si tocamos la puerta de abajo tampoco hace nada!!

Vamos a solucionar esto haciendo con estas condiciones y acciones para que al tocar la puerta de abajo suba.

3 En esta línea vamos a meter las siguientes condiciones y acciones:

Condicciones:

Las condiciones son: si, el personaje colisiona con PuertaLejos y la variable local de PuertaLejos es =1 entonces se realizan las acciones.

Acciones:

Mover el personaje a la capa “Principal”

Poner al personaje en esta posición (150,120)

Poner al personaje con este tamaño de (30,55) de vuelta a su tamaño!

Poner el comportamiento del sprite PlataformaLejos “Set Solid Disabled”

Poner el comportamiento del sprite PlataformaPrincipal “Set Solid Enabled”

Variable PuertaPrincipal “Set Puerta =0”

Variable PuertaLejos “Set Puerta =0”

Personaje comportamiento Flash: “Flash 0.3 on 0.1 off 2”

PlataformaPrincipal “Set opacity 100”

Con esta última línea, conseguimos que, si, está el personaje en la capa “Lejos” y colisiona con PuertaLejos, pues entonces volvería a estar en la capa principal y de nuevo cerca!!

Pulsar el botón “Run layout” y comprobar y disfrutar!!

Espero que os haya gustado ya que hayáis aprendido algo más… os dejo un enlace de donde está el tutorial por si tenéis alguna duda…

Aqui teneis un Ejemplo

Un Saludo!

Pequeñas notas: Si os caes hacia abajo, solo tenéis que presionar F5, o lo ponéis a través de una condición y acción que sería mucho más profesional..jejeje. También podéis bajar la velocidad del personaje cuando este lejos y volver a poner su velocidad normal cuando este cerca….

  • 0 Comments

  • Order by
Want to leave a comment? Login or Register an account!