Coloration

Nous recherchons toujours des traducteurs pour finir ce projet de traduction des articles de NeHe. Votre aide serait appréciée ! Vous êtes intéressé ? Alors contactez-nous à l'adresse suivante : .

En se basant sur le code de la leçon précédente, nous allons enrichir la fonction DrawGLScene. Je vais entièrement réécrire le code la fonction ci-après. Si vous comptez modifier la dernière leçon, vous pouvez remplacer la fonction DrawGLScene() par le code suivant, ou juste rajouter les lignes de codes suivantes qui étaient absentes du précédent tutoriel.

int DrawGLScene(GLvoid)                                // C'est ici que tous les tracés sont réalisés
{
   glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); // efface l'écran et le buffer de profondeur
   glLoadIdentity();                                   // Réinitialisation de la matrice Current Modelview
   glTranslatef(-1.5f,0.0f,-6.0f);                     // Déplacement: gauche 1.5 , intérieur Six Unités
   glBegin(GL_TRIANGLES);                              // tracé des Triangles

Si vous vous souvenez de la leçon précédente, il s'agit là de la portion de code permettant de dessiner le triangle dans la moitié gauche de l'écran. Dans la ligne de code suivante, nous utilisons pour la première fois la commande glColor3f(r,g,b). Les trois paramètres entre les parenthèses correspondent aux valeurs de l'intensité du rouge, du vert et du bleu. Ces paramètres ont un domaine de valeur variant de 0.0f à 1.0f. Cela fonctionne comme pour les valeurs de couleur utilisées lors de l'effacement de l'écran.

Nous réglons la couleur sur rouge (rouge complet, pas de composante verte ou bleue). La ligne de code qui suit va définir le premier sommet (angle supérieur du triangle) qui sera tracé en utilisant la couleur courante: le rouge. Tout ce qui sera tracé ensuite le sera en rouge, jusqu'à ce que nous changions de couleur.

      glColor3f(1.0f,0.0f,0.0f);        // Réglage de la couleur : rouge
      glVertex3f( 0.0f, 1.0f, 0.0f);    // Déplacement d'une unité vers le haut depuis le centre

Nous venons de définir le premier sommet sur l'écran en précisant sa couleur (rouge). Maintenant, et avant de définir le deuxième sommet, nous allons changer la couleur et prendre le vert. Ainsi, le second sommet qui sera le sommet gauche du triangle apparaitra en vert.

      glColor3f(0.0f,1.0f,0.0f);        // Réglage de la couleur : vert
      glVertex3f(-1.0f,-1.0f, 0.0f);    // Déplacement d'une unité vers le bas et la gauche

Au tour du troisième et dernier sommet. Avant de le tracer, nous changeons de couleur pour le bleu. Cela représentera le sommet de droite de notre triangle. Dès que la commande glEnd() aura été exécutée, le polygone sera rempli. Cependant, à cause de l'utilisation d'une couleur différente pour chaque sommet, au lieu d'obtenir un remplissage monocouleur, chacune des couleurs va diffuser depuis son sommet, rencontrer les autres au centre et se mélanger. C'est la coloration par lissage.

      glColor3f(0.0f,0.0f,1.0f);          // Réglage de la couleur : bleu
      glVertex3f( 1.0f,-1.0f, 0.0f);       // Déplacement d'une unité vers la droite et en bas
   glEnd();                                // fin du tracé du Triangle
   glTranslatef(3.0f,0.0f,0.0f);           // depuis le point de droite, déplacement de 3 unités vers la droite

Maintenant, nous allons tracer un carré et le colorier uniformément en bleu. Il est important de se souvenir que tout ce qui est tracé après la définition d'une couleur le sera dans cette couleur. Chaque projet que vous créerez par la suite utilisera la coloration d'une manière ou d'une autre. Même dans les scènes où tout est à base de textures, glColor3f pourra quand même être utilisée pour modifier la couleur de ces textures. Nous aborderons ce point plus tard.

Revenons à notre carré d'une seule couleur. Tout ce que nous avons à faire est de déclarer la couleur (le bleu dans notre exemple), puis de tracer ce carré. La couleur bleue sera utilisée pour chaque sommet puisque nous n'aurons pas demandé à OpenGL le changement de couleur entre chaque sommet. Le résultat est… un carré tout bleu ! À nouveau, le carré (polygone) est dessiné dans le sens des aiguilles d'une montre, signifiant que nous avons commencé le tracé en regardant l'arrière du carré.

   glColor3f(0.5f,0.5f,1.0f);         // unique définition de la couleur bleue
   glBegin(GL_QUADS);                 // début du tracé
      glVertex3f(-1.0f, 1.0f, 0.0f);  // à gauche et en haut d'une unité 
      glVertex3f( 1.0f, 1.0f, 0.0f);  // à droite et en haut d'une unité
      glVertex3f( 1.0f,-1.0f, 0.0f);  // à droite et en bas d'une unité
      glVertex3f(-1.0f,-1.0f, 0.0f);  // à gauche et en bas d'une unité
   glEnd();                           // le tracé est complet
   return TRUE;                       // on continue
}

Enfin, modification du code pour basculer du mode fenêtré vers le mode plein écran pour que le titre de la fenêtre soit correct.

if (keys[VK_F1])            // Appui sur la touche F1 ?
   {
   keys[VK_F1]=FALSE;       // si oui, annulation de la touche enfoncée
   KillGLWindow();          // suppression de la fenêtre courante
   fullscreen=!fullscreen;  // bascule entre les modes plein écran et fenêtré
   
   // Recréation de notre fenêtre OpenGL ( Modifiée )
   if (!CreateGLWindow("Le Tutoriel sur la Couleur de NeHe",640,480,16,fullscreen))
      {
      return 0;             // Abandon si la fenêtre n'a pas été créée
      }
   }

Dans cette partie, j'ai essayé d'expliquer de façon détaillée, comment ajouter la coloration « à plat » ou par lissage aux polygones openGL. À vous d'expérimenter : essayez de changer les valeurs des composantes rouge, vert et bleu. Regardez quelles couleurs peuvent être obtenues. Si vous avez des commentaires ou des interrogations, merci de m'envoyer un mail. Si vous pensez qu'un commentaire est incorrect ou que certaines portions du code peuvent être améliorées, faites-le-moi savoir. Je désire produire le meilleur tutoriel possible sur OpenGL. Je suis donc intéressé par votre retour d'expérience.

Jeff Molofee ( NeHe )

Compte tenu du nombre de versions de codes sources pour les tutoriels nehe, nous les laissons en anglais. En principe, si vous avez compris le code présenté dans ce tutoriel (et les tutoriels antérieurs), vous n'aurez pas de mal à le comprendre :

• ASM (Conversion par Foolman)
• BeOS (Conversion par Rene Manqueros)
• Borland C++ Builder 6 (Conversion par Christian Kindahl)
• C# (Conversion par Joachim Rohde)
• Code Warrior 5.3 (Conversion par Scott Lupton)
• CygWin (Conversion par Stephan Ferraro)
• D (Conversion par Familia Pineda Garcia)
• Delphi (Conversion par Michal Tucek)
• Dev C++ (Conversion par Dan)
• Euphoria (Conversion par Evan Marshall)
• Game GLUT (Conversion par Milikas Anastasios)
• GLUT (Conversion par Andy Restad)
• Irix (Conversion par Lakmal Gunasekara)
• Java (Conversion par Jeff Kirby)
• Java/SWT (Conversion par Victor Gonzalez)
• Jedi-SDL (Conversion par Dominique Louis)
• JOGL (Conversion par Kevin J. Duling)
• LCC Win32 (Conversion par Robert Wishlaw)
• Linux (Conversion par Richard Campbell)
• Linux GLX (Conversion par Mihael Vrbanec)
• Linux SDL (Conversion par Ti Leggett)
• LWJGL (Conversion par Mark Bernard)
• Mac OS (Conversion par Anthony Parker)
• Mac OS X/Cocoa (Conversion par Bryan Blackburn)
• MASM (Conversion par Nico (Scalp))
• Pelles C (Conversion par Pelle Orinius)
• Perl (Conversion par Cora Hussey)
• Power Basic (Conversion par Angus Law)
• Python (Conversion par John Ferguson)
• REALBasic (Conversion par Thomas J. Cunningham)
• Scheme (Conversion par Jon DuBois)
• Solaris (Conversion par Lakmal Gunasekara)
• VB.NET CsGL (Conversion par X)
• Visual Basic (Conversion par Ross Dawson)
• Visual Fortran (Conversion par Jean-Philippe Perois)
• Visual Studio
• Visual Studio NET (Conversion par Grant James)

Merci à MrDuChnok, à fearyourself et à wichtounet pour leur relecture.

Sommaire

Tutoriel précédent : Premier triangle et quadrilatère

Tutoriel prochain : Rotations