Je code, tu codes… vous codez ? #11

L’important, c’est de scorer !

Bonjour à toutes et à tous, et bienvenue dans cette nouvelle série d’articles qui traitera – en long, large et autres travers – de la programmation, et puisque nous sommes sur Cleek, nous parlerons bien entendu ici de l’art geek dans toute sa splendeur : le jeu vidéo et les étapes nécessaires pour créer le vôtre de A à Z !

Non, non, ne fuyez pas tout de suite, rassurez-vous, le développement de logiciels n’est en aucun cas, contrairement à certaines idées reçues, une affaire d’intellos reclus et monomaniaques ! En effet, quelques cuillères à soupe de logique, une ou deux onces de patience ainsi que quelques grammes de curiosité sont les seuls ingrédients requis pour développer la base d’un jeu vidéo.

Nous avons créé le premier boss de notre jeu lors de notre dernier tutoriel, cette semaine nous nous attaquerons au score et à son affichage. L’idée qui nous servira de fil conducteur sera d’attribuer à chaque ennemi un nombre de points qui viendront s’ajouter au score total lorsque notre NyanCat l’éliminera, mais aussi de gérer un multiplicateur de score, qui augmentera le score obtenu à chaque ennemi tant qu’on ne rate pas de « kill » pendant plus de deux secondes.

[divider]Affichage Tête Haute[/divider]

Commençons par le plus simple : nous avons besoin d’une police de caractère pour écrire notre score à l’écran. Pour cela, rien de plus simple, vous pouvez trouver gratuitement et rapidement votre bonheur à grands coups de Googlage. Nous utiliserons la police « Squared Display » pour ce tutoriel, mais rien ne vous empêche d’utiliser une autre si cela vous chante !

Pour ajouter cette nouvelle police dans votre projet, créez simplement un dossier « Fonts » dans votre projet et ajoutez-y la police après l’avoir décompressé.

Ensuite, nous allons créer un script pour gérer l’affichage de nos informations. Ce nouveau script portera le doux nom de « GestionHUD » (pour la petite histoire, sachez que le sigle « HUD » signifie « Affichage Tête Haute » et regroupe toutes les informations utiles au joueur : santé, mana, carte des environs, score, viseur).

Des nouveautés. Des terrifiantes nouveautés. Mais que cela ne vous empêche pas de recopier ce code !

Pas de panique, rien de bien méchant dans ce script ! Quelques explications seront néanmoins salutaires :

Les deux nouveaux objets « GUIStyle » et « Rect » – qui ont surement contribué à votre frayeur – sont issus des classes de Unity qui gère l’affichage. Le premier permet de définir un « style » d’écriture en réunissant les informations sur le choix de police, les gras et autres italiques ainsi que la taille du texte. Le second, Rect (à ne pas confondre avec « Rekt ») permet de définir un rectangle invisible à l’écran mais dans lequel nous allons pouvoir afficher des choses. Le Rect se définit par ses dimensions (hauteur et largeur) ainsi que par sa position (par rapport aux bords haut et gauche de l’écran).

En sachant que le « style » gère la police, la ligne suivante parait normalement plus claire :

style.font = (Font)Resources.Load (« Fonts/Squared_Display », typeof(Font));

Nous allons en fait chercher la police téléchargée au préalable dans le dossier que nous avons créé pour l’attribuer au style.

Ensuite, la ligne « totalScorePosition = new Rect (15, 10, 200, 20); » va créer un nouvel objet Rect aux coordonnées à 15 pixels du bord gauche et 10 du bord haut de l’écran, et cette boîte fera 200 pixels de long pour 20 de haut.

La dernière portion de code qui peut paraître barbare au premier abord s’explique pourtant assez simplement « GUI.Label (totalScorePosition,     « Score : « + totalScore, style); ». La méthode « Label » de la classe « GUI » va écrire et afficher le texte « « Score : « + totalScore » à la position « totalScorePosition » avec toutes les caractéristiques de police « style ».

Ce script sera à sauvegarder et surtout à associer à votre objet « Main Camera » comme sur l’image suivante :

Maintenant que notre score s’affiche à l’écran, nous allons le faire grossir au fur et à mesure que les explosions se feront entendre ! Pour réussir à atteindre notre objectif, nous allons devoir créer un script qui calcule le score, mais aussi farfouiller dans le script « GestionSante » afin d’augmenter les points gagnés pour chaque vaisseau abattu.

[divider]Je score, tu scores… Vous scorez ?[/divider]

Commençons par créer ce nouveau script, « GestionScore », qui contiendra le code suivant :

Le plus compliqué ici est la dernière ligne de la méthode « AddScore() » :

Camera.main.GetComponent<GestionHUD> ().SetInfoHUD (totalScore, multiplicateur);

Puisque nous avons attaché notre script GestionHUD à notre caméra principale, c’est comme cela que nous accédons à sa méthode SetInfoHUD qui va afficher le score et le multiplicateur pour nous dès que nous ferons appel à la méthode AddScore. Associez le script à notre NyanCat, et vous allez comprendre pourquoi bientôt, attribuez par la même occasion le tag « Player » à votre NyanCat.

La dernière étape est de modifier le script « GestionSante » comme sur l’exemple suivant.

Le plus gros des deux encadrés est le plus important : c’est à l’intérieur de celui-ci que nous retrouvons le NyanCat grâce au tag « Player », et nous allons chercher son script de Gestion du Score pour utiliser la méthode « AddScore() » dudit script.

Sauvegardez le tout, et lancez votre jeu : chaque ennemi rapporte désormais 3 points multipliés par… le multiplicateur ! Multiplicateur qui retombe à 1 dès que vous arrêtez de massacrer ces pauvres vaisseaux pendant deux secondes.