Exemple : Jeu Complet

Cette leçon constitue un petit jeu de collection. Le joueur se déplace dans une scène, heurte des murs, collecte des pièces et imprime un score final lorsque le jeu se termine.

Au lieu de coller le script entier d'un coup, l'exemple est divisé en parties que vous utiliserez dans la plupart des projets Tiniest2D :

variables d'actifs et d'état
start()
onUpdate(dt)
onCollision(objA, objB)
end()

1. Actifs et État du Jeu

La première section crée les actifs et les variables que le reste du script utilisera. Les sprites sont des images, la scène est le niveau, le joueur est un objet placé dans cette scène, et les variables de score/vitesse stockent un état de jeu simple.

// Créer des actifs
var playerImg = Sprite(16, 16)
var wallImg = Sprite(16, 16)
var coinImg = Sprite(8, 8)
var level = Scene()

// Créer l'objet joueur
var player = Object("Player")

// État du jeu
var score = 0
var speed = 100

À ce stade, les variables existent, mais le jeu n'a pas encore placé quoi que ce soit dans la scène. Cette configuration se fait dans start().

2. La Fonction start()

start() s'exécute une fois lorsque le jeu commence. Utilisez-le pour configurer des objets, définir la première scène, positionner la caméra et préparer des valeurs de départ.

func start() {
    // Configuration du joueur
    setSprite(player, playerImg)
    setCollisionType(player, COLLISION_DYNAMIC())
    setX(player, 50)
    setY(player, 50)
    addObject(level, player)

    // Définir la scène de départ
    setScene(level)

    // Centrer la caméra sur le joueur
    setCameraX(level, getX(player))
    setCameraY(level, getY(player))
    setCameraZoom(level, 3)

    print("Collectez les pièces !")
}

Le joueur utilise COLLISION_DYNAMIC() car il doit entrer en collision et être repoussé par les murs. La caméra commence centrée sur le joueur afin que la vue du niveau commence au bon endroit.

3. La Fonction onUpdate(dt)

onUpdate(dt) s'exécute à chaque image. C'est ici que le joueur lit les entrées, se déplace, met à jour la caméra et vérifie les touches de réinitialisation.

dt signifie "delta time" : le temps écoulé depuis l'image précédente. Multiplier le mouvement par dt rend la vitesse de mouvement plus cohérente selon les différents taux d'images.

func onUpdate(dt) {
    // Mouvement du joueur
    var moveX = 0
    var moveY = 0

    if (isKeyHeld(KEY_LEFT()) || isKeyHeld(KEY_A())) {
        moveX = -1
    }
    if (isKeyHeld(KEY_RIGHT()) || isKeyHeld(KEY_D())) {
        moveX = 1
    }
    if (isKeyHeld(KEY_UP()) || isKeyHeld(KEY_W())) {
        moveY = -1
    }
    if (isKeyHeld(KEY_DOWN()) || isKeyHeld(KEY_S())) {
        moveY = 1
    }

    // Appliquer le mouvement
    setX(player, getX(player) + moveX * speed * dt)
    setY(player, getY(player) + moveY * speed * dt)

    // La caméra suit le joueur
    setCameraX(level, getX(player))
    setCameraY(level, getY(player))

    // Réinitialiser le niveau avec la touche R
    if (isKeyPressed(KEY_R())) {
        resetScene(level)
        setX(player, 50)
        setY(player, 50)
        score = 0
        print("Niveau réinitialisé !")
    }
}

Le code de mouvement crée une direction à partir des entrées du clavier. Ensuite, il ajoute cette direction à la position actuelle du joueur. La caméra est mise à jour après le mouvement pour qu'elle suive la nouvelle position.

4. La Fonction onCollision(objA, objB)

onCollision(objA, objB) s'exécute lorsque deux objets entrent en collision. Dans cet exemple, les pièces doivent utiliser COLLISION_TRIGGER(). Les objets déclencheurs signalent les chevauchements, mais ne bloquent pas le mouvement.

func onCollision(objA, objB) {
    var nameB = getName(objB)
    var typeB = getCollisionType(objB)

    // Collecte de pièces (les pièces doivent être de type TRIGGER dans l'éditeur de scène)
    if (typeB == COLLISION_TRIGGER()) {
        removeObject(level, objB)
        score = score + 1
        print("Score : " + score)
    }
}

Lorsque le joueur touche un déclencheur, le script retire cet objet de la scène et augmente le score. C'est le schéma de base pour les objets ramassables, clés, améliorations et points de contrôle.

5. La Fonction end()

end() s'exécute lorsque le jeu s'arrête. Cet exemple n'imprime que le score final, mais des jeux plus grands peuvent utiliser cette fonction pour le nettoyage ou des messages de débogage finaux.

func end() {
    print("Score final : " + score)
}

Configuration de l'Exemple

Créer les sprites :
Ctrl+Click sur playerImg, dessinez un personnage (par exemple, une simple figure en bâton)
Ctrl+Click sur wallImg, dessinez un bloc solide
Ctrl+Click sur coinImg, dessinez un petit cercle ou un diamant
Concevoir la scène :
Ctrl+Click sur level
Sélectionnez wallImg dans le panneau de gauche, définissez la collision sur "Statique"
Peignez des murs autour des bords et créez un labyrinthe
Sélectionnez coinImg, définissez la collision sur "Aucune" pour les tuiles de pièces décoratives
Placez des pièces autour du niveau comme repères visuels
Créer des objets de pièce déclencheurs :

Les sprites estampillés dans la scène sont utiles pour les tuiles et la décoration, mais les pièces collectables doivent être des objets pour que les rappels de collision puissent les retirer. Ajoutez des objets de pièces comme ceci :

var coin1 = Object("Coin1")
var coin2 = Object("Coin2")

func start() {
    // ... configuration du joueur ...

    // Configuration des pièces en tant que déclencheurs
    setSprite(coin1, coinImg)
    setCollisionType(coin1, COLLISION_TRIGGER())
    setX(coin1, 100)
    setY(coin1, 80)
    addObject(level, coin1)

    setSprite(coin2, coinImg)
    setCollisionType(coin2, COLLISION_TRIGGER())
    setX(coin2, 150)
    setY(coin2, 120)
    addObject(level, coin2)

    // ... reste de start ...
}

Ce même schéma peut être étendu à plus de pièces, ennemis, portes ou tout objet nécessitant un comportement de script.

Créer des jeux 2D avec Tiniest2D

Exemple de Jeu Complet

Keep your place in this quest