Python, créer une interface avec Pygame

La création de petit script est intéressante sur en langage Python qui est simple à prendre en main et à mettre en oeuvre, la mise en place d’interface se fait également de manière rapide avec Pygame.Nous avions vu dans un précédent article : création d’une interface avec TkInter était facile, il existe une autre bibliothèque tout aussi simple à utiliser : Pygame.

Pygame, à la différence de Tkinter, est une librairie spécialement conçu pour le développement de jeu en temps réel en utilisant le langage Python (cf : wiki). Oui Tkinter est surtout prévu pour la création d’interface tournée vers les logiciels (je ne dit pas que nous ne pouvons pas faire de jeu avec).

Nous allons voir dans cette article, les principes de base pour l’utilisation de Pygame.

Installation de Pygame

Ce n’est pas que je sois fainéant, mais vu le nombre important de système, je vous mets le lien du site de Pygame pour l’installation en fonction de votre système : ici pour installer.

Sachez que de base, il est installer sur Raspberry (Raspbian).

Il existe pour Python 2.7 et Python 3.

Première utilisation de Pygame

Nous n’allons pas voir ici comment réaliser un jeu complet (cela sera fait dans un futur proche) mais tout simplement l’affichage d’un fond, d’un bouton, avec une action sur celui-ci et deux trois autres trucs, rien de transcendant mais si tu commence à lire ça, c’est que tu ne connais pas.

Vous allez pouvoir télécharger l’ensemble des scripts et quelques goodies, sur le git https://github.com/zigomato/PygameTuto.

Nous allons tout simplement commencer par notre en-tête du script et comme tout script python, nous allons mettre dans un fichier nommé main.py :

#!/usr/bin/env python3
# coding: utf-8

Voilà, voilà, un bon début, intégrons maintenant nos bibliothèque :

import pygame
from pygame.locals import *

La première ligne est obligatoire, la seconde est optionnel mais  sert à rendre publiques certaines constantes, prenez l’habitude de l’importer.

Nous allons initialiser Pygame dans notre script :

pygame.init()

Nous allons ouvrir une fenêtre qui contiendra notre jeu :

fenetre = pygame.display.set_mode((640,480))

Cela va ouvrir une fenêtre qui aura pour taille 640 pixels de largeur et 480 pixels de hauteur, il y a bien sur des options, notamment se mettre en plein écran, mais attendez un peu avant de le faire.

Pour tester ce que cela donne, lancer le script, pour Linux et à partir du terminal, faire : python3 ./main.py

Mais que se passe-t-il, ma fenêtre s’est ouverte puis refermée ? Tout à fait normal, le script s’est exécuté, arrivé à la fin, le script est fini, nous allons inclure une petite boucle (ne mettez pas le mode plein écran, cela peut être compliqué de revenir sinon) :

continuer = True
while continuer :
     continue

Je commence par initialiser un booléen et tant qu’il est vrai, je continu.

Maintenant, je n’arrive pas à fermer cette fenêtre !!!!! Et maintenant, nous allons parler de vos évènements, où comment interagir avec votre script, nous allons simplement ajouter la fermeture en cliquant sur la petite croix et sur la touche échappe, votre boucle devient :

while continuer :
     for event in pygame.event.get():
          if event.type == QUIT:
               continuer = False
          if event.type == KEYUP:
               if event.key == K_ESCAPE :
                    continuer = False

Voilà comment sont géré les évènements dans Pygame, il en existe plein, voir dans le git. en tout cas, maintenant, vous pouvez fermer votre fenêtre proprement.

Nous allons agrémenter un peu notre fenêtre, en y mettant un fond, nous allons prendre une image quelconque que vous placerez dans ressources/images/ et nommerez surprises.png, vous pouvez bien entendu choisir autre chose, ou bien télécharger directement le script sur git.

Le script complet devient :

#!/usr/bin/env python3 
# coding: utf-8

import pygame 
from pygame.locals import *

pygame.init()

fenetre = pygame.display.set_mode((640,480))

fond = pygame.image.load("ressources/images/surprise.png").convert_alpha()

continuer = True

while continuer : 
     for event in pygame.event.get(): 
          if event.type == QUIT: 
               continuer = False 
          if event.type == KEYUP: 
               if event.key == K_ESCAPE : 
                    continuer = False
     fenetre.blit(fond,(0,0))
     pygame.display.flip()

Pour les nouveautés du script, nous créons un objet « fond » qui contient l’image, png avec une prise en compte du canal alpha.

Ensuite, nous la plaçons dans notre fenêtre à la position x = 0 et y = 0 (dans l’ordre (x,y)) avec la ligne : fenetre.blit(fond,(0,0))

Dans notre boucle, nous actualisons la fenêtre avec : pygame.display.flip()

Nous allons placer un petit bouton sur lequel il faut cliquer, ce sera très basique vous devriez sans soucis comprendre le mecanisme du rafraichissement de l’image et de la gestion des évènements.

A la différence de tkinter, il n’y pas de widget tout prêt fait, dans widget, il faut créer ses propres fonctions.

Voyons le script suivant :

#!/usr/bin/env python3
# coding: utf-8

import pygame, random
from pygame.locals import *

pygame.init()

fenetre = pygame.display.set_mode((468,512))

pygame.display.set_caption("Votre titre de fenêtre")

son = pygame.mixer.Sound("ressources/son/click.wav")

fond = pygame.image.load("ressources/images/surprise.png").convert_alpha()
bouton_rouge = pygame.Surface((136,63))
position_bouton_rouge = bouton_rouge.get_rect()
bouton_rouge.fill((255,0,0))

bouton_vert = pygame.Surface((136,63))
position_bouton_vert = (200,200,200,200)
bouton_vert.fill((0,255,0))

continuer = True

while continuer :
  for event in pygame.event.get():
    if event.type == QUIT:
      continuer = False
    if event.type == KEYUP :
      if event.key == K_ESCAPE :
        continuer = False	
    if event.type == MOUSEBUTTONDOWN :
      if event.button == 1 :
        son.play()
        if position_bouton_rouge.collidepoint(event.pos):
          position_bouton_vert = position_bouton_rouge
          position_bouton_rouge = pygame.Rect(random.randrange(0,468-136,1),random.randrange(0,512-63,1),163,63)
  fenetre.fill((0,0,0))
  fenetre.blit(fond,(0,0))
  fenetre.blit(bouton_rouge,position_bouton_rouge)
  fenetre.blit(bouton_vert,position_bouton_vert)
  pygame.display.flip()

Attardons nous seulement sur les nouveaux éléments,

  • nous avons créé deux surfaces rectangulaires : bouton_vert = pygame.Surface((136,63)) et bouton_rouge = pygame.Surface((136,63)).et les avons colorées :bouton_rouge.fill((255,0,0)) , idem pour le bouton vert mais avec un code RGB différent (pour Red Green Blue, de 0 à 255, 0 pas de couleur du canal, 255 pourl e canal à fond)
  • ensuite, nous avons créé une variables pour positionner ces boutons : position_bouton_rouge = bouton_rouge.get_rect() et position_bouton_vert = (200,200,200,200)
  • dans notre boucle, j’ai rajouté la détection du clique : if event.type == MOUSEBUTTONDOWN : et de l’appui sur le clic gauche : if event.button == 1 :, au clic, nous jouons un petit son
  • ensuite, nous regardons, si il y a une collision entre la position du clic et de notre bouton rouge : if position_bouton_rouge.collidepoint(event.pos):, puis nous mettons à jour la position de nos boutons
  • les 5 dernières lignes servent à rafraichir notre fenêtre.

A vous de jouer pour cliquer sur notre bouton rouge.

 Conclusion

Si vous avez bien suivi, lu et relu, si vous n’aviez pas compris, vous vous êtes rendu compte que pygame pouvait être réellement puissant. Vous pouvez facilement imaginer le travail nécessaire pour la réalisation d’un jeu. Je tacherai de faire un petit article pour montrer la création d’un jeu avec plusieurs fenêtre.

N’hésitez pas à partager et à commenter.

Laisser un commentaire