Construyendo un Juego Básico

Para ayudarte a empezar, esta guía te lleva paso a paso por la construcción de un juego de recolección de manzanas.

Colección de manzanas

Este juego de ejemplo pasa por alto detalles que se cubren en profundidad en otras guías. Si necesitas ayuda, consulta la barra lateral izquierda o usa la función de búsqueda en la parte superior para obtener información adicional.

Construyendo el mapa

Comenzaremos creando un mundo básico con una isla para caminar y una manzana para recoger después.

1. Busca una Manzana y una Isla en el Catálogo de Activos y arrástralas a la vista de escena de tu juego.

1. ¡Esa isla es bastante pequeña! En el Inspector establece el Escala a 10x10 para agrandarla

1. Ahora la isla tiene un buen tamaño, ¡pero la manzana está detrás de la isla! Establece la Capa en -10 para empujarla detrás de todo lo demás.

Añadiendo scripts

En el scripts directorio de tu proyecto de juego, crea un nuevo archivo llamado pickup_apple.csl y ábrelo en un editor de texto o usa un IDE basado en IA.

Pega el siguiente script de ejemplo y guarda el archivo:

// Esto crea el componente que hace que la manzana sea interactiva,
// lo añadiremos a la Manzana en el siguiente paso del tutorial. 
Pickup_Apple :: class : Interactable {
    is_picked_up: bool;

    ao_start :: method() {
        this->set_listener(this);
        this->set_text("Recoger");
    }

    can_use :: method(player: Player) -> bool {
        if is_picked_up return false;
        return true;
    }

    on_interact :: method(player: Player) {
        if is_picked_up return;
        is_picked_up = true;

        // Iniciar el efecto pop
        effect := new(Apple_Pop_Effect);
        entity->set_active_effect(effect);
    }
}

// Una animación genial para cuando te la comes :D 
Apple_Pop_Effect :: class : Effect_Base {
    sprite: Sprite_Renderer;
    start_scale: v2;
    start_pos: v2;

    effect_start :: method() {
        sprite = entity->get_component(Sprite_Renderer);
        start_scale = entity.local_scale;
        start_pos = entity.local_position;
        set_duration(0.4);
    }

    effect_update :: method(dt: float) {
        t := get_elapsed_time() / 0.4;

        // Aumenta la escala y luego encoge rápidamente hasta desaparecer
        scale_curve: float;
        if t < 0.3 {
            // Rápido pop hacia arriba (escalar a 1.3x)
            scale_curve = lerp(1.0, 1.3, Ease.out_back(t / 0.3));
        } else {
            // Encoger hasta desaparecer
            scale_curve = lerp(1.3, 0.0, Ease.in_back((t - 0.3) / 0.7));
        }

        entity->set_local_scale(start_scale * scale_curve);

        // Flotar hacia arriba ligeramente
        rise := Ease.out_quad(t) * 0.5;
        entity->set_local_position({start_pos.x, start_pos.y + rise});

        // Desvanecerse cerca del final
        if sprite != null {
            alpha := 1.0 - Ease.in_quad(max(0.0, (t - 0.5) / 0.5));
            sprite.color.w = alpha;
        }
    }

    effect_end :: method(interrupt: bool) {
        entity->destroy();
    }
}

Añadiendo el componente Manzana

Ahora que has creado tu script de la manzana, necesitaremos aplicarlo a la manzana en la escena. Para hacerlo, añadiremos el nuevo Pickup_Apple componente del script usando el Inspector.

1. Selecciona tu Manzana en la escena

2. Haz clic en el botón "Añadir componente" en el Inspector.

3. Busca el componente "Pickup_Apple" y haz clic en él para añadirlo a la manzana

Ahora verás que el componente se ha añadido a la manzana. Puedes ajustar algunos campos de la Manzana cambiando los valores en el inspector:

Jugando tu juego

Cuando estés listo, pulsa el divertido triángulo verde y prueba tu juego.

Próximos pasos

En las siguientes secciones aprenderás cómo probar tu juego con varios jugadores, crear tus propios scripts y construir el mundo de tus sueños.

Aquí hay algunos desafíos para intentar:

• Haz muchas manzanas para que el jugador las coma

• Reproducir efectos de sonido cuando se comen

• Avanzado: intenta escribir un script para reaparición de más manzanas después de que se coman

--

NOTA AL MARGEN: Si tu isla tiene baja resolución/pixelada, haz clic en el recurso png de la isla en la sección "Assets" y establece el Multiplicador de remuestreo a 1 y haz clic en Aplicar