7. ÉTAPE 6 : Remplacer les carrés par des images (Sprites)


Objectif

L'élève apprend à charger des fichiers externes (images .png) et à les afficher à la place des formes géométriques.

Question motivante

"Un carré bleu, c'est fonctionnel, mais un héros avec une épée, c'est mieux ! Comment transformer nos données en graphismes ?"

Concepts clés à maîtriser

  • pygame.image.load() : Importer un fichier image dans la mémoire.

  • pygame.transform.scale() : Redimensionner l'image pour qu'elle corresponde à la taille (width, height) du dictionnaire.

  • screen.blit() : "Tamponner" l'image sur l'écran (remplace draw.rect).


Code à préparer (Avant la boucle principale)

Il faut d'abord charger les images. Pour que le code fonctionne, les élèves doivent avoir un dossier nommé assets avec des fichiers player.png et enemy.png.

Python
# ===== CHARGEMENT DES IMAGES =====
# On charge l'image et on la redimensionne directement à la taille du joueur
player_img = pygame.image.load("assets/player.png").convert_alpha()
player_img = pygame.transform.scale(player_img, (player['width'], player['height']))

enemy_img = pygame.image.load("assets/enemy.png").convert_alpha()
enemy_img = pygame.transform.scale(enemy_img, (40, 40)) # Taille standard

Code à modifier (Dans la section AFFICHAGE)

Les élèves doivent remplacer leurs pygame.draw.rect(...) par :

Python
    # Dessiner le joueur avec son image
    screen.blit(player_img, (player['x'], player['y']))
    
    # Dessiner les ennemis avec leur image
    for enemy in enemies:
        screen.blit(enemy_img, (enemy['x'], enemy['y']))

Le défi "Pro" (Optionnel)

Gestion de l'orientation :

"Comment faire pour que le personnage regarde à gauche quand on appuie sur la touche GAUCHE ?"

Indice : Utiliser pygame.transform.flip(player_img, True, False).