-
Une chose qu’il faut bien comprendre lorsque l’on commence a vouloir afficher différents éléments dans une même fenêtre avec Pygame c’est que l’affichage de ces éléments se fera dans l’ordre ou l’on le définit.
Dans mon tout premier exemple (Voir étape 1), mon code est le suivant :
import pygame
screen = pygame.display.set_mode((800,600))
background = pygame.image.load('fond.png').convert()
perso = pygame.image.load('boy.png').convert_alpha()
while True:
for event in pygame.event.get():
if event.type == pygame.QUIT:
sys.exit
screen.blit(background,(0,0))
screen.blit(perso,(150,250))
pygame.display.flip()
Etudions ce code en détail :
On importe la bibliothèque Pygame, qui contient tout les modules, fonctions, etc..qui nous serviront
import pygame #On importe Pygame
Puis on définit ce qui sera notre écran principal, la fenêtre ou tout s’affichera (on peut la considérer comme la cadre d’un tableau)
(Traduction: Screen = Ecran en anglais). Nous voulons que celle-ci fasse 800 pixel de long par 600 pixel de hauteur.
screen = pygame.display.set_mode((800,600))
Puis on définit l’image de fond (background en anglais), et on indique a Pygame de la convertir pour un chargement ultérieur plus rapide.(on peut la considérer comme la toile d’un tableau)
background = pygame.image.load('fond.png').convert()
On fait de même avec l’image de notre personnage, on indique cette fois ci a Pygame que notre image a un fond ‘alpha’ et qu’il ne doit pas afficher ce fond, si l’on oubli cette conversion, notre personnage sera entouré d’un fond noir, blanc, rose,(ou autre couleur) suivant le fond de l’image que vous auriez pu choisir.
perso = pygame.image.load('boy.png').convert_alpha()
Jusqu’à présent nous n’avons définit que des éléments , des “objets”, mais nous n’avons encore rien mis en oeuvre pour les faire s’afficher. C’est ce que nous allons voir à présent.
La boucle principale du jeu : le cœur du programme , ce qui tourne en permanence et donne vie a notre projet se trouve ici.
while True: # Boucle principale du jeu
for event in pygame.event.get():
if event.type == pygame.QUIT:
sys.exit
On pourrait traduire cette boucle ainsi : En sachant que les conditions sont toujours vraies dans python tant qu’on ne déclare pas l’inverse.
L’action QUIT est effectuée en cliquant sur la croix de fermeture de fenêtre, tout comme dans Windows
TANT QUE les conditions sont VRAIES:
POUR tout événements DANS le gestionnaire d’événement de Pygame :
SI le type d’évènement est égal a QUITTER Pygame :
Fermer le processus système.
Déclaration de l’affichage : C’est enfin ici que nous allons déclarer notre affichage et dire a Pygame l’ordre dans lequel afficher nos éléments ( objets) que nous avons précédemment définit( déclaré) avant notre boucle principale.
Le mot BLIT veut dire «Afficher », et se présente ainsi :
surface.blit(source, destination)
Nous déclarons a Pygame d’afficher l’écran et dans celui-ci le fond, donc l’image que nous avons définit comme fond(background). Nous voulons que celle-ci soit affichée à partir coordonnées d’origine de l’écran, notre image de fond étant elle aussi en 800*600 pixel, elle recouvrira tout l’écran.
Donc ici la surface est l’écran, la source a afficher est le fond et la destination est une position sur l’écran.
screen.blit(background,(0,0))
Même chose, nous déclarons l’affichage sur l’écran de notre personnage, mais celle foit ci a la position x=150,y=250.
screen.blit(perso,(150,250))
Puis la commande déclarant à Pygame de tout rafraîchir. Nous y reviendrons ultérieurement, il en existe d’autre. Celle-ci dit a Pygame de rafraîchir tout ce qu’il y a à l’écran.
pygame.display.flip()
A RETENIR : Si nous avions choisi d’afficher en premier le personnage , puis le fond, le personnage aurait été recouvert par le fond et nous ne l’aurions pas vu . Il est donc important de faire attention a l’ordre de déclaration de l’affichage de nos objets. Pour ceux qui connaissent Photoshop ou autre logiciel utilisant les calques, considérez chaque nouvel objet comme un calque qui l’on pose sur le précédent pour les voir s’afficher.
Essayer de changer la position 0,0 de l’affichage du fond en modifiant les valeurs , et voyez ce qui se produit.
2. Système de coordonnées et affichage :
Mais dans Pygame il en est autrement, le point 0 se situe en haut a gauche de l’écran.
En mathématique classique l’affichage des abscisses et des ordonnées se fait ainsi :
Cette notion est fondamentale pour bien comprendre ou afficher les objets sur notre écran, ainsi nous pouvons dire que pour un personnage afficher au milieu de l’écran ( pour un écran d’une taille de 800pixel par 600 pixels, celui-ci devra étre affiché en x= 400 et Y = 300.
Comme on peut le voir sur l’image ci-dessus, si le personnage doit se déplacer vers la droite, la valeur de X augmentera, si il se déplace vers la gauche la valeur de X diminuera. Il en est de même si le personnage veut se déplacer vers le bas, la valeur de Y augmentera, et s’il se déplacer vers le haut, celle-ci diminuera.
Il en est de même pour l’affichage de fenêtres et de tout objets dans Pygame. Par exemple si je veux afficher une minimap en haut a gauche, une horloge en dessous, une barre de raccourcis de talents, des icônes de raccourcis permettant d’afficher par exemple la fiche du personnage, les barre de vie du personnage etc…tout ceci doit s’afficher dans un ordre permettant de les voir.
On peut représenter cela graphiquement ainsi :
Nous voyons donc que nous avons une surface affichée en premier : l’écran (screen), dans laquelle nous affichons le fond ( background),puis l’interface utilisateur (UI), et enfin notre personnage ( perso) . Dans le code cela revient à écrire ceci :
screen.blit(background,(0,0))
screen.blit (UI, (0,0))
screen.blit(perso,(150,250))
pygame.display.flip()
Voici pour les notions basiques d'affichage dans Pygame ainsi que la Hierarchies à respecter.
1 commentaire
-
Première fenètre
La majeures parties des éléments graphiques sont de Daniel Cook, vous trouverez un lien vers les ressources dans la catégorie Liens Utiles.
Pour créer ma première carte du monde je n’ai pas utiliser le système de Tiled, ou de sprites ( choses que je ferais plus tard), car je voulais quelque chose d’opérationnel rapidement pour pouvoir tester des fonctionnalités de gameplay. Donc je me suis dit, quels sont les éléments nécessaires pour tester ce que je veux :
Un village de départ
Une grotte avec un terrible monstre !
Un filon de métal quelconque ou aller miner
Un donjon
Quelques éléments comme un moulin ou la cabane d’un quelconque Hermite.
Ceci a donné la carte suivante.
Rien d’extraordinaire, mais cela m’a permis de voir tout ce que l’on pouvait faire avec son concept de « Small World ».
Le code de ceci :
import pygame
screen = pygame.display.set_mode((800,600))
background = pygame.image.load('fond.png').convert()
while True: # Boucle principale du jeu
for event in pygame.event.get():
if event.type == pygame.QUIT:
sys.exit
screen.blit(background,(0,0))
pygame.display.flip()
Voila quel sera notre espace de jeu pour les prochaines étapes de notre création.
Nous devons à présent y incorporer notre personnage et le faire s'y mouvoir.
2 commentaires
Suivre le flux RSS des articles Suivre le flux RSS des commentaires
|
 Créer mon blog |
Créer mon compte |