Cómo generar una cuadrícula de plataformas con Scene Graph

Generar una secuencia de plataformas en cuadrícula única en la que solo se pueda saltar sobre un par de plataformas de cada fila es habitual en los modos de juego de plataformas. Esto hace que los jugadores bajen el ritmo y traten de averiguar la secuencia.

Este tutorial muestra cómo generar una cuadrícula de plataformas en la que las plataformas de cada fila se seleccionan aleatoriamente para que tengan colisión y un color claro para distinguirlas mientras que el resto no.

Cómo crear el prefabricado de plataformas

Sigue estos pasos para crear un prefabricado de plataformas que generarás a partir de Verse:

1. Coloca una nueva entidad y conviértela en un prefabricado con el nombre choose_one_platform_prefab. Para obtener instrucciones, consulta Prefabricados e instancias de prefabricados.

2. En el editor de prefabricados, añade los siguientes componentes a la entidad:

   • transform_component: el componente de transformación para colocar la plataforma en su posición.

   • mesh_component: el componente de malla para establecer la malla estática de la plataforma. En este ejemplo se utiliza la malla SM_block_02 del paquete recursos Stylized Egyptian World Pack del Marketplace de Fab.

   • collision_component: l componente de colisión para habilitar y deshabilitar la colisión en la plataforma.

   • parent_constraint_component: el componente de restricción padre para establecer fácilmente la transformación relativa a la entidad padre cuando se genera este prefabricado en el mundo con Verse.

   

3. Añade una entidad hijo y asígnale el nombre Light.

4. Añade los siguientes componentes a la entidad hijo Light:

   • transform_component: el componente de transformación que coloca la entidad por encima de la plataforma.

   • point_light_component: el componente de luz puntual para añadir una fuente de luz que cambia de color en función de si la plataforma tiene colisión.

   • parent_constraint_component: el componente de restricción principal que restringe la transformación de esta entidad en relación con la entidad padre.

   

5. Guarda el prefabricado.

Tu prefabricado aparece ahora en el archivo Assets.digest.verse como una clase con el mismo nombre que tu prefabricado, choose_one_platform_prefab.

Cómo generar una cuadrícula de plataformas

Sigue estos pasos para crear una cuadrícula a partir del prefabricado de plataformas:

1. Crea un componente de Verse con el nombre choose_one_component. Para conocer los pasos necesarios para crear un componente de Verse, consulta Cómo crear tu propio componente de Verse.

2. Añade las siguientes propiedades editables:

   • Un campo de vector 2D entero vector2i con el nombre GridSize para definir cuántas plataformas hay en la cuadrícula. X es el número de filas e Y es el número de columnas de la cuadrícula.

   • Un campo de vector 2D de coma flotante vector2 con el nombre PlatformSpacing para especificar el espaciado entre las plataformas a través de las filas y columnas.

     ~~~(verse) GridSizeTip<localizes>:message = "Tamaño de la cuadrícula, donde la cuadrícula tiene X unidades de ancho por Y unidades de profundidad." PlatformSpacingTip<localizes>:message = "La distancia entre cada plataforma de la cuadrícula."

     choose_one_component<public> := class(component):

     # Tamaño de la cuadrícula, donde la cuadrícula tiene X unidades de ancho por Y unidades de profundidad. @editable_vector_number(int): ToolTip := GridSizeTip MinComponentValue := option{0} GridSize:vector2i = vector2i{X := 3, Y := 10}

     # Distancia entre cada plataforma de la cuadrícula. @editable_vector_number(float): ToolTip := PlatformSpacingTip MinComponentValue := option{0.0} PlatformSpacing:vector2 = vector2{X := 256.0, Y := 256.0} ~~~

3. En la función OnSimulate, itera sobre el vector GridSize para saber cuántas plataformas generar. En el bucle, crea una instancia de tu clase de prefabricado y añádela a la entidad a la que está unido este componente Verse, para generar el prefabricado en el mundo.

   ~~~(verse) GridSizeTip<localizes>:message = "Tamaño de la cuadrícula, donde la cuadrícula tiene X unidades de ancho por Y unidades de profundidad." PlatformSpacingTip<localizes>:message = "La distancia entre cada plataforma de la cuadrícula."

   choose_one_component<public> := class(component):

   # Tamaño de la cuadrícula, donde la cuadrícula tiene X unidades de ancho por Y unidades de profundidad. @editable_vector_number(int): ToolTip := GridSizeTip MinComponentValue := option{0} GridSize:vector2i = vector2i{X := 3, Y := 10}

   # Distancia entre cada plataforma de la cuadrícula. @editable_vector_number(float): ToolTip := PlatformSpacingTip MinComponentValue := option{0.0} PlatformSpacing:vector2 = vector2{X := 256.0, Y := 256.0}

   OnSimulate<override>()<suspends>:void= # Genera plataformas para crear la cuadrícula. for (Column := 0..GridSize.Y - 1): for (Row := 0..GridSize.X - 1): # Al crear una instancia de un prefabricado y añadirla a una entidad existente, el prefabricado aparecerá en el mundo. ChooseOnePlatform := choose_one_platform_prefab{} Entity.AddEntities(array{ChooseOnePlatform}) ~~~

4. Si ejecutas el código ahora, todas las plataformas aparecerán en el mismo lugar. Dado que el prefabricado tiene el componente de transformación y el componente de restricción padre, puedes establecer la propiedad InitialRelativeTransform en su componente de transformación para generar el prefabricado en un desfase relativo a la ubicación de la entidad a la que estás añadiendo el prefabricado. Sin el componente de restricción principal en la entidad que estás generando, tendrías que especificar la ubicación en el espacio del mundo (y no relativa a la entidad raíz).

   Verse

        GridSizeTip<localizes>:message = "Size of the grid, where the grid is X units wide by Y units deep."
        PlatformSpacingTip<localizes>:message = "The distance between each platform on the grid."
   
        choose_one_component<public> := class(component):
   
            # Size of the grid, where the grid is X units wide by Y units deep.
            @editable_vector_number(int):
                ToolTip := GridSizeTip
                MinComponentValue := option{0}
            GridSize:vector2i = vector2i{X := 3, Y := 10}
   
   Expand code Copy full snippet(45 lines long)

5. Guarda y compila tu código.

Si unes este componente Verse a una entidad y abres una sesión, aparecerá una cuadrícula de plataformas en la ubicación de esa entidad.

Cómo seleccionar aleatoriamente plataformas válidas

Ahora que tienes una red de plataformas generadas en el mundo, puedes añadirles más funciones. Los siguientes pasos muestran cómo seleccionar aleatoriamente las plataformas que van a colisionar para generar una secuencia única y cambiante de plataformas por las que el jugador puede saltar.

Sigue estos pasos para seleccionar aleatoriamente plataformas válidas en la cuadrícula:

1. Añade las siguientes propiedades editables al componente de Verse:

   • Una variable de número entero con el nombre MinCorrectPlatformsPerRow para especificar el número mínimo de plataformas que tienen colisión.

   • Una variable de número entero con el nombre MaxCorrectPlatformsPerRow para especificar el número máximo de plataformas que tienen colisión.

   • Una variable de color con el nombre ChosenColor para establecer el color de la plataforma si la colisión está habilitada.

   • * Una variable de color con el nombre NotChosenColor para establecer el color de la plataforma si la colisión no está habilitada.

     Verse

                               using { /UnrealEngine.com/Temporary/SceneGraph }
                               using { /UnrealEngine.com/Temporary/SpatialMath }
                               using { /Verse.org }
                               using { /Verse.org/Colors }
                               using { /Verse.org/Native }
                               using { /Verse.org/Random }
                               using { /Verse.org/Simulation }
     
                               GridSizeTip<localizes>:message = "Size of the grid, where the grid is X units wide by Y units deep."
                               PlatformSpacingTip<localizes>:message = "The distance between each platform on the grid."
     
     Expand code Copy full snippet(54 lines long)

2. El resultado de una expresión for es una matriz de cada iteración. Almacena todas las plataformas generadas para una fila en una matriz y pasa esta matriz a una función para establecer aleatoriamente las plataformas con el nombre RandomizeCollidablePlatformsPerRow().

   Verse

        OnSimulate<override>()<suspends>:void=
            # For each row, spawn multiple platforms and pick a number of them to have collision while the others don't.
            # The platforms with collision will have the Chosen color for their light component.
            # The platforms without collision will have the NotChosen color for their light component.
            for (Row := 0..GridSize.Y - 1):
                EntitiesInRow := for (Column := 0..GridSize.X - 1):
                    # The prefab has a parent constraint component so set the InitialRelative Transform
                    # on the transform component to offset each platform relative to this entity.
                    # This means the platform prefabs will spawn same distance from each other
                    # but moving the root entity will change where the platforms originate.
   
   Expand code Copy full snippet(34 lines long)

3. Crea una función con el nombre RandomizeCollidablePlatformsPerRow que debe seleccionar aleatoriamente las entidades que tendrán colisión y haz que se deshabilite la colisión en todas las entidades. Dado que el componente de luz puntual está en la entidad hijo del prefabricado, puedes utilizar FindComponents para buscar entre los hijos de la entidad la luz puntual para cambiar su color.

   Verse

        # Randomly choose platforms to have collision in the row.
        RandomizeCollidablePlatformsPerRow(Entities:[]entity):void=
            # Disable all the entities before choosing which ones to enable.
                # It disables an entity by disabling the collision on the entity,
                # and finding a point light in its child entities to change its color.
                for:
                    EntityPlatform : Entities
                    Collision := EntityPlatform.GetComponents(collision_component)[0]
                    Light := EntityPlatform.FindComponents(point_light_component)[0]
                do:
   
   Expand code Copy full snippet(12 lines long)

4. Crea un método de ampliación para matrices con el nombre ChooseOne para elegir un elemento aleatorio de la matriz. El resultado es una tupla que contiene tanto el elemento elegido como una matriz con el resto de elementos sin seleccionar.

   Verse

        # An extension method for an array to get a randomly selected element from the array.
        (Input:[]t where t:subtype(comparable)).ChooseOne()<decides><transacts>:tuple(t, []t)=
            ChosenElement := Input[GetRandomInt(0, Input.Length - 1)]
            NotChosenElements := Input.RemoveFirstElement[ChosenElement]
            (ChosenElement, NotChosenElements)

   Copy full snippet(5 lines long)

5. Llama a ChooseOne desde RandomizeCollidablePlatformsPerRow para seleccionar una entidad, habilitar su colisión y cambiar su color.

   Verse

        # Randomly choose platforms to have collision in the row.
        RandomizeCollidablePlatformsPerRow(Entities:[]entity):void=
            # Disable all the entities before choosing which ones to enable.
            # It disables an entity by disabling the collision on the entity,
            # and finding a point light in its child entities to change its color.
            for:
                EntityPlatform : Entities
                Collision := EntityPlatform.GetComponents(collision_component)[0]
                Light := EntityPlatform.FindComponents(point_light_component)[0]
            do:
   
   Expand code Copy full snippet(23 lines long)

6. Actualiza RandomizeCollidablePlatformsPerRow para elegir varias entidades y que tengan colisión basada en las propiedades editables. Primero, obtén un valor aleatorio entre el número mínimo y máximo de plataformas correctas por fila y elige una entidad tal número de veces. A continuación, elimina la entidad que se ha elegido de la lista de próximos candidatos posibles.

   Verse

        # Randomly choose platforms to have collision in the row.
        RandomizeCollidablePlatformsPerRow(Entities:[]entity):void=
            # Disable all the entities before choosing which ones to enable.
            # It disables an entity by disabling the collision on the entity,
            # and finding a point light in its child entities to change its color.
            for:
                EntityPlatform : Entities
                Collision := EntityPlatform.GetComponents(collision_component)[0]
                Light := EntityPlatform.FindComponents(point_light_component)[0]
            do:
   
   Expand code Copy full snippet(29 lines long)

7. Guarda y compila tu código.

Si abres una sesión ahora, se genera una cuadrícula de plataformas en el mundo con una secuencia única de plataformas que tienen colisión y el color elegido.

Secuencia de comandos completa

using { /UnrealEngine.com/Temporary/SceneGraph }
using { /UnrealEngine.com/Temporary/SpatialMath }
using { /Verse.org }
using { /Verse.org/Colors }
using { /Verse.org/Native }
using { /Verse.org/Random }
using { /Verse.org/Simulation }

GridSizeTip<localizes>:message = "Size of the grid, where the grid is X units wide by Y units deep."
PlatformSpacingTip<localizes>:message = "The distance between each platform on the grid."