Programmation, ISN, Archives, Processing

Mise au point d’un jeu de Casse-briques avec Processing

L’objectif de cette activité est d’apprendre quelques rudiments de programmation sous Processing par la mise au point d’un petit jeu de Casse-briques.

L’objectif de cette activité est d’apprendre quelques rudiments de programmation sous Processing par la mise au point d’un petit jeu de Casse-briques.

On suppose que Processing a été correctement installé.

On s’aidera pour cela :

  • Du manuel en français de Processing du site flossmanuals.net (réalisé pour la version 2 de Processing).
  • De l’aide de Processing (voir Aide/Documentation ; on peut aussi placer le curseur sur mot et utiliser Aide/Chercher dans la documentation).

Il est demandé de prendre régulièrement des notes dans votre carnet de bord. Pour cela on pourra s’aider des balises <pre> et <code>.  Exemple :

<pre><code>
Quelques lignes de code
</code></pre>

Récupération du fichier

Pour commencer, télécharger le fichier CasseBriques.zip et le décompresser dans votre sketchbook.

Lancer le programme pour le tester.

Tâche n°1 : Rédiger la documentation des fonctions nettoyer(), bouger() et dessiner()

Cahier des charges : Les fonctions nettoyer(), bouger() et dessiner() doivent être documentées à l’aide de commentaires dans le code du programme. La documentation permet de comprendre le rôle et le fonctionnement de chaque fonction.

Ressource :

Indications :

  • Identifier dans le programme les lignes de la fonction draw() où sont appelées les fonctions nettoyer(), bouger() et dessiner().
  • Pour comprendre l’effet d’une fonction, on peut désactiver son appel en commentant la ligne correspondante dans le programme.
  • Les documentations des fonctions nettoyer(), bouger() et dessiner() doivent se trouver aux lignes respective n° :  98, 107 et 126.

Tâche n°2 : Calculer et afficher le score du joueur

Cahier des charges : Le joueur gagne 100 points chaque fois qu’une brique est touchée. Le score s’affiche dans le bandeau en haut à droite.

Ressources :

Indications :

  • Après avoir lu la documentation sur les variables, déterminer le type à choisir pour la variable score.
  • Une variable peut-être globale ou locale, selon que l’on peut y accéder partout dans le programme ou seulement là où elle est déclarée (par exemple dans une fonction ou une boucle). Déterminer si la variable score doit être locale ou globale.
  • Les variables globales sont déclarées au tout début du programme (voir le commentaire au début du programme). Les variables locales sont déclarées là où on en a besoin. Déclarer correctement, avec le bon le type et au bon endroit, la variable score.
  • Initialiser dans la fonction setup() la variable score à la valeur qu’elle doit prendre au début du jeu.
  • Repérer dans le programme l’endroit où est identifié qu’une brique a été touchée [aide : chercher dans la fonction rebond()]. Ajouter à cet endroit 100 point à la variable score.
  • Afficher le score à droite du bandeau dans la fonction dessiner_bandeau() à l’aide des fonctions textAlign() et text(). On pourra utilement utiliser les variables width et height de Processing qui contiennent les dimensions de la fenêtre de dessin.

Tâche n°3 : Afficher un message avant de lancer le jeu

Cahier des charges : Afficher le message « Pret ? » avant de lancer le jeu.  Pour cela écrire l’en-tête de la fonction afficher, dont le code est commenté tout à la fin du programme.

Ressources :

Indications

  • Repérer à la toute fin du fichier le code de la fonction afficher qui est commenté.
  • La fonction afficher prend comme paramètre un message et ne renvoie rien. Déterminer le type de la fonction afficher et de son paramètre message.
  • Écrire à la place de la ligne « // EN TÊTE À CRÉER », l’en-tête de la fonction afficher.
  • Modifier la fonction setup(), qui est appelée au début du jeu, pour afficher le message voulu à l’aide de la fonction afficher().

Tâche n°4 : Traiter la sortie du terrain de la balle

Cahier des charges : Pour le moment la sortie du terrain de la balle n’est pas gérée. Écrire la fonction perdre qui affiche le message « Perdu ! » et l’appeler lorsque la balle sort du terrain.

Ressource :

Indications :

  • Écrire la fonction perdre qui affiche le message voulu à l’aide de la fonctions afficher.
  • Quelle est la condition qui permet de savoir si la balle est sortie de la fenêtre ?
  • Identifier dans le programme l’endroit où tester la sortie de la balle.
  • Se servir des variables de Processing comme width ou height.

Tâche n°5 : Calculer automatiquement la position des briques

Cahier des charges : Créer une fonction repartir permettant de calculer de manière automatique la position des différentes briques du mur. Cette fonction renverra la position sur une longueur donnée de l’élément n°i sur un total de N éléments. Utiliser cette fonction pour répartir les briques du mur sur toute la largeur, mais seulement sur la moitié supérieure de la fenêtre. Modifier pour cela la fonction creer_mur().

Ressource :

Indications :

  • Les briques sont dessinées avec l’option rectMode(CENTER).
  • Identifier les paramètres à fournir à la fonction, leurs types, et le type de la grandeur de retour.
  • Il faut utiliser deux fois la fonction repartir : une fois pour l’abscisse, et une fois pour l’ordonnée de la brique.
  • Tester la fonction pour différentes configurations des 8 briques du programme (par exemple 2×4, 4×2, 2+4+3, etc.).

Tâche n°6 : Réécrire la fonction creer_mur()

Cahier des charges : Réécrire la fonction creer_mur() à l’aide de boucles afin qu’elle soit plus lisible et occupe le moins de lignes possibles.

Ressource :

Tâche n°7 : Modifier le nombre et l’état des briques

Cahier des charges : Modifier le programme de manière à ce que le nombre de briques soit fixé automatiquement par le nombre de lignes et de colonnes voulus. Fixer ceux-ci à 6 lignes de 8 briques. Les briques de la ligne n°1 (en partant du bas) sont détruite en un coup, celles de la ligne n°2 en deux coups, etc.

Ressource :

Indication :

  • Le nombre de coups nécessaire pour détruire une brique est fixé par la variable etat de la classe Brique (voir fichier Brique.pde).

Pour finir

Après avoir complété les sept tâches précédentes et avoir pris des notes sur chacune dans votre carnet de bord, plusieurs pistes d’améliorations peuvent être envisagées pour le casse-brique. Par exemple :

  • Utiliser un nombre de vie limité, et l’afficher dans le bandeau.
  • Au bout d’un certain temps, renforcer la résistance des briques, et/ou diminuer la taille de la raquette.
  • Jouer avec plusieurs balles.
  • Créer plusieurs niveaux, avec de plus en plus de briques, ou des brique de plus en plus difficiles à détruire.
  • etc.