Première fenêtre et premier sprite

Des exercices pour apprendre à ser servir de Pyxel

Coder la fenêtre de notre jeu

import pyxel

# constantes (des variables dont la valeur ne change jamais)
LARGEUR = ...   # largeur de notre fenêtre
HAUTEUR = ...   # hauteur de notre fenêtre
FPS = ...   # nombre d'images par seconde dans notre jeu
NOIR = ...  # voir la documentation pour connaître le nombre correspondant à la couleur noire
BLANC = ... # faire pareil avec les autres couleurs
VERT = ...
ORANGE = ...
ROUGE = ...
TITRE = ... # titre de la fenêtre (à mettre entre guillemets)

# taille de la fenetre 128x128 pixels
# penser à utiliser les constantes définies juste au-dessus
# pour la quit_key, voir les touches clavier à la fin de la documentation
pyxel.init(..., ..., title = ... , fps = ..., quit_key=...)

def update():
    pass        # pour l'instant, on ne fait rien dans cette fonction

def draw():

    # effacer la fenêtre et la remplir de couleur noire (voir la documentation pour savoir comment faire)
    # utiliser la constante NOIR définie plus haut
    ...

pyxel.run(update, draw)

A faire dans cet exercice :

  • copier / coller le code ci-dessus dans votre éditeur et faites ce qui suit :
  • dans les parenthèses de pyxel.init, remplacer les ... par les valeurs appropriées pour obtenir une fenêtre de 128 pixels de large sur 128 pixels de haut avec le titre que vous souhaitez et qui se ferme grâce à la touche que vous aurez choisie.
  • dans la fonction draw(), écrire le code qui permet d'effacer le contenu de la fenêtre et de mettre un fond noir. Si besoin, chercher dans la documentation de pyxel
  • exécuter votre programme pour vérifier qu'il fonctionne

Vous pouvez vous aider du cours de ce site et de la documentation en ligne pour répondre à ce premier exercice.

Insérer une forme (un sprite) qui représentera notre personnage (vaisseau, serpent suivant le cas

Nous pourrons, lors de la prochaine étape, déplacer cette forme, cet élément de notre jeu. Il va donc porter le nom de sprite.

import pyxel

# constantes (des variables dont la valeur ne change jamais)
LARGEUR = ...   # largeur de notre fenêtre
HAUTEUR = ...   # hauteur de notre fenêtre
FPS = ...   # nombre d'images par seconde dans notre jeu
NOIR = ...  # voir la documentation pour connaître le nombre correspondant à la couleur noire
BLANC = ... # faire pareil avec les autres couleurs
VERT = ...
ORANGE = ...
ROUGE = ...
TITRE = ... # titre de la fenêtre (à mettre entre guillemets)
CASE = ...  # taille (arête) de notre sprite (carré)

# variables globales (des variables dont la valeur change et qui seront utilisées partout)
sprite_x = ...      # définir la position horizontale du sprite au début (moins de la valeur de LARGEUR !)
sprite_y = ...      # définir la position verticale du sprite au début (moins de la valeur de HAUTEUR !)

# taille de la fenetre 128x128 pixels
# penser à utiliser les constantes définies juste au-dessus
pyxel.init(..., ..., title = ... , fps = ..., quit_key=...)

def update():
    pass        # pour l'instant, on ne fait rien dans cette fonction

def draw():

    # effacer la fenêtre et la remplir de couleur noire (voir la documentation pour savoir comment faire)
    # utiliser la constante NOIR définie plus haut
    ...
    # dessiner une forme carrée de couleur ORANGE (notre sprite) (voir la documentation ou ci-dessous pour savoir comment faire)
    # le carré est positionné aux coordonnées sprite_x, sprite_y et il est de taille CASE
    ...

pyxel.run(update, draw)

On complète notre programme précédent :

  • au début du programme, on détermine les coordonnées x, y pour positionner le sprite (sprite_x, sprite_y). A vous de choisir. Attention la fenêtre ne fait que 128 sur 128 pixels, il ne faut pas dépasser ces valeurs.
  • dans draw(), nous allons dessiner un carré représentant notre vaisseau. Pour cela nous allons utiliser la fonction pyxel.rect().

Cette fonction est paramétrée de la façon suivante : pyxel.rect(positionx, positiony, largeur, hauteur, couleur) :

  • positionx, positiony : position (horizontale, verticale) du carré
  • largeur : largeur du carré
  • hauteur : hauteur du carré
  • couleur : couleur du carré (à choisir parmi les 16 disponibles)