TD12 : Interface Graphique

Nous allons maintenant nous concentrer sur le développement d'une interface graphique pour notre petit jeu. Pour ce faire, nous allons utiliser la bibliothèque SDL2 (Simple DirectMedia Layer). Un des points forts de SDL2 est incontestablement sa "simplicité" et sa portabilité sous de multiples architectures dont Android !

Une démo pour bien commencer

Pour vous aider à prendre en main cette bibliothèque, nous vous avons préparé une petite démo (demo.c), accessible sur https://github.com/orel33/sdl2-demo, ainsi qu'un modèle-type (model.c) qui vous servira de point de départ pour programmer votre propre interface graphique. Ces deux programmes (demo et model) suivent la même structure et partagent les fichiers main.c et model.h.

  • Compilez avec CMake, testez et étudiez le code de ces exemples. Voir le fichier README.md pour plus de détails.
  • Quel est le rôle des fonctions init(), render(), process() et clean() ?
  • A quoi sert la structure Env ?

demo sdl2

Nota Bene : Pour lancer cette démo sous Windows, vous disposez d'un tutoriel spécifique, car c'est un peu compliqué.

Si vous souhaitez travailler à distance, vous pouvez utiliser X2Go, qui permet de facilement accéder à distance à l'interface graphique des ordinateurs du CREMI, que vous soyez sur Linux, MacOS ou Windows : tutoriel!

Voici un peu de documentation pour vous aider :

Travail demandé

Une fois que vous avez assimilé les rudiments de cette démo et du modèle fourni, vous pouvez commencer à programmer votre interface graphique.

  • Plus précisément, vous devez implémenter les fonctions init(), render(), process() et clean() du fichier model.c, en respectant le modèle fourni.
  • Ces fonctions manipulent toutes une instance de la structure Env, que vous pouvez enrichir à votre guise. Merci de veiller à ne pas utiliser de variables globales, ni à coder des fonctions trop longues ! En principe, il n'est pas nécessaire de modifier le fichier main.c.
  • Le programme doit s'appeler game_sdl et il prend en paramètre optionnel une grille de jeu en fichier, comme game_text.
  • On prendra soin d'adapter "au mieux" l'affichage au dimension courante de la fenêtre. Cela sera particulièrement important pour réussir le portage du jeu sous la plateforme Android.
  • Le jeu doit permettre via des boutons et/ou des raccourcis clavier d'accéder à toutes les fonctionnalités : jouer un coup dans une case, redémarrer le jeu, annuler un coup ou le rejouer, trouver la solution à l'aide du solveur, ...
  • En outre, il est intéressant d'afficher les erreurs lorsque l'on joue un mauvais coup.
  • N'oubliez pas de rajouter dans votre fichier README.md un paragraphe pour décrire le fonctionnement de votre interface graphique.
  • Attention, les ressources que votre exécutable utilise (police de caractères, images, jeu par défaut, ...) doivent être accessibles via des chemins relatifs. Dans la démo fournie, nous utilisons le répertoire res pour stocker ces fichiers. Examinez la ligne suivante dans le fichier CMakeLists.txt qui permet de copier toutes les ressources dans le répertoire build où est produit l'exécutable game_sdl.
file(COPY res DESTINATION ${CMAKE_CURRENT_BINARY_DIR})
  • Rendez votre travail sur Moodle à la fois dans le rendu VPL et dans le rendu Devoir (grille d'évaluation). La note artistique est importante, mais l'ergonomie l'est encore plus !

A vous de jouer.