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()
etclean()
? - A quoi sert la structure
Env
?
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 :
- https://wiki.libsdl.org/
- https://www.libsdl.org/projects/SDL_ttf/
- https://www.libsdl.org/projects/SDL_image/
- https://fr.wikibooks.org/wiki/Programmation_avec_la_SDL
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()
etclean()
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, commegame_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 fichierCMakeLists.txt
qui permet de copier toutes les ressources dans le répertoirebuild
où est produit l'exécutablegame_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.