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

En los modos de juego de plataformas, es común generar una secuencia exclusiva de plataformas en cuadrícula donde solo un par de plataformas en cada fila es válido para saltar. Esto requiere que los jugadores reduzcan la velocidad y descubran la secuencia.

En este tutorial, se muestra cómo generar una cuadrícula de plataformas en la que las plataformas de cada fila se seleccionan de forma aleatoria para que tengan colisión y un color de luz para distinguirlas, mientras que el resto no.

Cómo crear el prefabricado de plataforma

Sigue estos pasos para crear un prefabricado de plataforma que generarás en Verse:

1. Coloca una nueva entidad y promociónala a prefabricado con el nombre modify_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:

   • transformar_componente: El componente transformar para posicionar la plataforma.

   • 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 recurso del recurso Stylized Egyptian World Pack en Fab.

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

   • parent_constraint_component: el componente de restricción de base para configurar fácilmente la transformación relativa a la entidad base al generar este prefabricado en el mundo usando Verse.

   

3. Añade una entidad derivada y nómbrala Light.

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

   • transform_component: El componente transformar que posiciona la Entidad sobre la plataforma.

   • point_light_component: el componente de luz puntual para agregar 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 base.

   

5. Guarda el prefabricado.

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

Cómo generar una cuadrícula de plataformas

Sigue estos pasos para generar una cuadrícula hecha con el prefabricado de plataforma:

1. Crea un componente de Verse llamado choose_one_component. Para conocer los pasos 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 denominado GridSize para definir cuántas plataformas hay en la cuadrícula. X representa la cantidad de filas e Y, la cantidad de columnas en la cuadrícula.

   • Un campo vectorial 2D de punto flotante vector2 denominado PlatformSpacing para especificar el espaciado entre las plataformas en las filas y las columnas.

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

     choose_one_component<public> := clase(componente):

     # 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 en 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 por el vector GridSize para saber cuántas plataformas generar. En el bucle, crea una instancia de la clase del prefabricado y añádela a la entidad a la que está conectado este componente de Verse, para generar el prefabricado en el entorno.

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

   choose_one_component<public> := clase(componente):

   # 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 en 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): # Si creas una instancia de un prefabricado y la añades a una entidad existente, el prefabricado aparecerá en el entorno. ChooseOnePlatform := choose_one_platform_prefab{} Entidad.AddEntities(array{ChooseOnePlatform}) ~~~

4. Si ejecutaras el código ahora, todas las plataformas aparecerían en la misma ubicación. Dado que el Prefabricado tiene el componente transformar y el componente de restricción base, puedes definir la propiedad InitialRelativeTransform en su componente transformar para generar el Prefabricado con un desplazamiento relativo a la ubicación de la Entidad a la que añades el Prefabricado. Si la entidad que vas a generar no tuviera el componente de límite de base, tendrías que especificar la ubicación en el espacio del entorno (y no en relación con 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 conectas este componente de Verse a una entidad y comienzas una sesión, aparecerá una cuadrícula de plataformas en la ubicación de esa entidad.

Selección aleatoria de plataformas válidas

Ahora que generaste una cuadrícula de plataformas en el entorno, puedes añadirles más funcionalidad. Los pasos siguientes indican cómo seleccionar de forma aleatoria las plataformas para que tengan colisión a fin de generar una secuencia exclusiva y cambiante de plataformas por las que pueda saltar un jugador.

Sigue estos pasos para seleccionar de forma aleatoria plataformas válidas en la cuadrícula:

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

   • Una variable entero denominada MinCorrectPlatformsPerRow para especificar la cantidad mínima de plataformas que tienen colisión.

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

   • Una variable de color denominada ChosenColor para definir el color de la plataforma si la colisión está habilitada.

   • Una variable de color denominada NotChosenColor para definir 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 denominada RandomizeCollidablePlatformsPerRow() para establecer las plataformas de forma aleatoria.

   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 llamada RandomizeCollidablePlatformsPerRow que debería seleccionar aleatoriamente las entidades para tener colisión, y hacer que deshabilite la colisión en todas las entidades. Dado que el componente de luz puntual está en la Entidad derivada del Prefabricado, puedes usar FindComponents para buscar entre los hijos de la Entidad el punto de luz 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 extensión para las matrices denominado ChooseOne que permite elegir un elemento aleatorio de la matriz. El resultado es una tupla que contiene el elemento elegido y una matriz con todos los demás elementos que no están seleccionados.

   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. Llamar a ChooseOne desde RandomizeCollidablePlatformsPerRow para seleccionar una Entidad para que tenga 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 que sean varias entidades las que se elijan para tener colisión de acuerdo con las propiedades editables. Primero, obtén un valor aleatorio entre la cantidad mínima y máxima de plataformas correctas por fila y elige una entidad tantas veces como sea necesario. Luego, elimina la entidad que se eligió de la lista de candidatos siguientes para elegir.

   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 comienzas una sesión ahora, se genera una cuadrícula de plataformas en el entorno con una secuencia exclusiva 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."