View on GitHub

Zelda-Like Creation Guide

Un guide complet pour créer un jeu de type Zelda avec Godot Engine.

🎒 CrĂ©ation d’un SystĂšme d’Inventaire dans Godot 4.4.1

Bienvenue aventuriĂšre du pixel ! 🌟 Aujourd’hui, nous allons crĂ©er un systĂšme d’inventaire simple et Ă©lĂ©gant pour ton jeu RPG Zelda-like. Tu verras, c’est super pratique et les Resources de Godot vont rendre ça ultra flexible ! 🚀

📌 Objectif

CrĂ©er un systĂšme d’inventaire utilisant les Resources pour stocker et gĂ©rer des items. Cela permettra de charger facilement des objets, de les manipuler dans plusieurs endroits de ton jeu, et d’afficher leur contenu dans ton interface utilisateur. 🎼

📁 PrĂ©paration

🌟 Étape 1 : CrĂ©ation de l’Inventaire (inventory.gd)

  1. Créer un nouveau script :

    • File → New Script
    • Extends : Resource.
    • Nom : inventory.gd
    • Dossier : res://inventory/

  2. Ajouter une classe pour facilement gĂ©rer l’inventaire :

extends Resource

class_name Inventory  # Facilite l'utilisation de l'inventaire par d'autres scripts

@export var items: Array[InventoryItem]  # Liste d'items dans l'inventaire

Pourquoi utiliser une class_name ? đŸ€”
✅ Cela permet de rĂ©fĂ©rencer l’inventaire facilement dans d’autres scripts, comme ton joueur ou l’UI d’inventaire.

🌟 Étape 2 : CrĂ©ation des Items (inventoryItem.gd)

  1. Créer un nouveau script :

    • File → New Script
    • Extends : Resource.
    • Nom : inventoryItem.gd
    • Dossier : res://inventory/

  2. Ajouter une classe pour les items :

extends Resource

class_name InventoryItem  # Facilite l'utilisation des items dans d'autres scripts

@export var name: String  # Nom de l'item
@export var texture: Texture2D  # Texture de l'item

🌟 Étape 3 : CrĂ©ation des Items SpĂ©cifiques

  1. Créer un dossier items dans res://inventory/.

  2. Créer une ressource InventoryItem :

    • Dans l’inspecteur, clique sur le dossier avec le petit + vert.
    • Recherche InventoryItem.

    • Remplis les champs comme suit :

      • Name : lifepot
      • Texture : Glisse-dĂ©pose la texture de la potion.
    • Sauvegarde sous : res://inventory/items/lifepot.tres.

    🎒 Texture d'inventaire

  3. RĂ©pĂšte l’opĂ©ration pour d’autres items (ex: sword).

🌟 Étape 4 : CrĂ©er une Resource d’Inventaire pour le Joueur

  1. Créer une nouvelle resource Inventory :

    • Nom : playerInventory.tres
    • Dossier : res://inventory/

  2. Ajouter des items :

    • Clique sur l’Array dans l’inspecteur.
    • Glisse-dĂ©pose lifepot.tres et sword.tres dans l’inventaire.

    📩 Inventory Player

    • Sauvegarde bien !

🌟 Étape 5 : Lier l’Inventaire au Joueur

  1. Ajouter cette ligne au script de ton joueur (Player.gd) :
@export var inventory: Inventory  # Associer l'inventaire au joueur

  1. Dans la scĂšne du joueur :

    • Tu verras un champ dĂ©diĂ© pour ajouter l’inventaire dans l’inspecteur.
    • Lie playerInventory.tres.

    📩 Inventory Player 2

🌟 Étape 6 : Interface Graphique (Slot GUI)

  1. Dans la scĂšne des slots :

    • Renomme ton Sprite2D contenant les slots : background.
    • Ajoute un Sprite2D en tant qu’enfant et renomme-le : item.

  2. Script pour chaque slot (slot_gui.gd) :

extends Node

@onready var backgroundSprite: Sprite2D = $background
@onready var itemSprite: Sprite2D = $item

func update_item(item: InventoryItem) -> void:
    if !item:
        backgroundSprite.frame = 0
        itemSprite.visible = false
    else:
        backgroundSprite.frame = 1
        itemSprite.texture = item.texture
        itemSprite.visible = true

🌟 Étape 7 : Centrage des Items dans les Slots

  1. Ajoute un CenterContainer en tant qu’enfant du RootNode.
  2. Ajoute un Panel en tant qu’enfant du CenterContainer.
  3. DĂ©place ton item (le Sprite2D) Ă  l’intĂ©rieur du Panel.
  4. Ajuste la taille du CenterContainer pour correspondre Ă  ses enfants.
  5. Dans l’inspecteur, utilise Layout → Custom Min Size pour ajuster la taille.
  6. RĂ©initialise la position du Sprite2D item Ă  (0, 0) pour qu’il soit bien centrĂ©.

💡 N’oublie pas de mettre Ă  jour les chemins si nĂ©cessaire, comme par exemple :

@onready var itemSprite: Sprite2D = $CenterContainer/Panel/item

📩 Inventory Player 3

🌟 Conclusion

🎉 Bravo ! Tu as maintenant un inventaire qui affiche dynamiquement les items collectĂ©s, parfaitement centrĂ©s dans les slots. C’est clean et ça marche super bien ! đŸ’Ș

Continue de t’éclater dans ton dĂ©veloppement ! đŸŒžđŸ±â€đŸ‘€

🌟 Étape 12 : ImplĂ©menter la fonction insert() dans inventory.gd

Nous allons maintenant faire en sorte que la fonction insert() ajoute vraiment les items Ă  notre inventaire.

📂 Modification de inventory.gd

Remplace la fonction insert() par ceci :

func insert(item: InventoryItem):
    if item and not items.has(item):
        items.append(item)
        print("✅ Item ajoutĂ© : ", item.name)

✅ Explications :

🌟 Étape 13 : CrĂ©er un systĂšme de collecte d’objets

Nous allons faire en sorte que lorsque Elara touche un objet (lifepot), cet objet soit ajouté à son inventaire.

📂 Modification de collectable.gd

Modifions notre script collectable.gd pour détecter les collisions :

extends Area2D

@export var itemRes: InventoryItem  # Référence à notre item (par exemple : lifepot.tres)

func _on_Area2D_body_entered(body):
    if body.has_method("insert") and itemRes:
        body.insert(itemRes)
        queue_free()

✅ Explications :

🌟 Étape 14 : Connecter le signal body_entered

Dans l’inspecteur de ton objet lifepot (ou tout autre collectable) :

  1. SĂ©lectionne ton Area2D.
  2. Va dans l’onglet Node > Signals.
  3. Connecte le signal body_entered Ă  ton script collectable.gd.
  4. Vérifie que ta fonction _on_Area2D_body_entered est bien appelée.

🌟 Étape 15 : Tester l’ajout d’un objet

  1. Lance ton jeu.
  2. Fais en sorte qu’Elara touche le lifepot.
  3. Ouvre la console (F8) et vérifie que le message de confirmation apparaßt : 
    ✅ Item ajoutĂ© : lifepot

👏 Bravo ! Tu viens de crĂ©er ton premier systĂšme de loot ! 🎒🎼

Veux-tu maintenant que je te montre comment afficher les objets dans ton inventaire UI ? 😊📚✹