Lektion 3

Im letztem Tutorial habe ich Ihnen beigebracht, wie man Dreiecke und Quadrate auf dem Bildschirm anzeigt. In diesem Tutorial werde ich Ihnen beibringen, wie man das Dreieck und das Quadrat auf zwei verschiedene Arten färben kann. Flat Coloring füllt das Quadrat mit einer Farbe. Smooth Coloring blendet die 3 Farben, die an jedem Punkt (Vertex) des Dreiecks angegeben sind, ineinander über, so dass eine nette Vermischung der Farben entsteht.

Wir benutzen den Code aus dem letzten Tutorial und erweitern die DrawGLScene Prozedur. Ich werde folgend nochmal die komplette Prozedur aufschreiben, so dass Sie, wenn Sie den Code der letzten Lektion verändern wollen, die DrawGLScene Prozedur mit dem folgenden Code ersetzen können oder einfach den fehlenden Code hinzufügen, der im letzten Tutorial noch nicht enthalten war.

int DrawGLScene(GLvoid)                    // Hier kommt der ganze Zeichnen-Kram hin
{
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);    // Löscht den Bildschirm und den Depth-Buffer
    glLoadIdentity();                    // Resettet die aktuelle Modelview Matrix

    glTranslatef(-1.5f,0.0f,-6.0f);                // Links 1.5 dann 6 Einheiten in den Bildschirm hinein

    glBegin(GL_TRIANGLES);                // Fange an, Dreiecke zu zeichnen

Wenn Sie sich an das letzte Tutorial erinnern, ist das die Sektion Code, wo das Rechteck auf der linken Hälfte des Bildschirms gezeichnet wird. In der nächsten Zeile Code benutzen wir das erste Mal glColor3f(r,g,b). Die drei Parameter in den Klammern sind die Werte für die Rot, Grün und Blau Intensität. Die Werte können zwischen 0.0f und 1.0f liegen. Das ganze arbeitet in der selben Weise, wie die Farbwerte, die wir zum löschen des Hintergrunds verwenden.

Wir setzen die Farbe Rot (volle Rot-Intensität, kein Grün, kein Blau). Die Codezeile direkt danach ist der erste Vertex (die Spitze des Dreiecks) und wird mit der Farbe gezeichnet ist, die gerade gesetzt ist, also rot. Alles was wir von nun an zeichnen, wird in rot sein, bis wir die Farbe auf was anderes als Rot setzen.

        glColor3f(1.0f,0.0f,0.0f);            // Setzt die Farbe auf Rot
        glVertex3f( 0.0f, 1.0f, 0.0f);            // Eine Einheit aus dem Zentrum nach oben  (Oberste Punkt)

Wir haben den ersten Vertex auf den Bildschirm gebracht und seine Farbe auf Rot gesetzt. Nun, bevor wir den zweiten Vertex setzen, ändern wir die Farbe auf Grün. Auf diese Weise wird der zweite Vertex, welcher die linke Ecke des Dreiecks ist, auf grün gesetzt.

        glColor3f(0.0f,1.0f,0.0f);            // Setzt die Farbe auf Grün
        glVertex3f(-1.0f,-1.0f, 0.0f);            // Eine Einheit nach links und unten (unten links)

Nun kommen wir zum dritten und letzten Vertex. Bevor wir ihn aber zeichnen, setzen wir die Farbe auf Blau. Dieser wird die rechte Ecke des Dreiecks. Sobald der glEnd() Befehl ausgeführt wird, wird das Polygon gefüllt. Da es aber an jedem Vertex eine andere Farbe hat, statt einer einheitlichen Farbe, werden die Farben jeweils aus jeder Ecke gezeichnet und treffen ungefähr in der Mitte zusammen, wo sie ineinander übergehen. Das nennt man Smooth-Coloring.

        glColor3f(0.0f,0.0f,1.0f);            // Setzt die Farbe auf Blau
        glVertex3f( 1.0f,-1.0f, 0.0f);            // Eine Einheit nach rechts und unten (unten rechts)
    glEnd();                        // Fertig mit dem Zeichnen von Dreiecken 

    glTranslatef(3.0f,0.0f,0.0f);                // Vom rechten Punkt 3 Einheiten nach rechts bewegen

Nun werden wir ein solides blaues Rechteck zeichnen. Es ist wichtig, daran zu denken, dass alles was gezeichnet wird, nachdem die Farbe gesetzt wurde, in dieser Farbe gezeichnet wird. Jedes Projekt das Sie erzeugen werden, wir in irgend einer Weise Färbungen vornehmen. Selbst in Szenen, wo alles texturiert ist, kann glColor3f dazu benutzt werden, um die Farbe der Textur zu tönen. Mehr dazu später.

So, um nun unser Rechteck in einer Farbe zu zeichnen, müssen wir lediglich die Farbe auf eine Farbe setzen, die wir haben wollen (blau in unserem Beispiel) und das Rechteck zeichnen. Die Farbe Blau wird für jeden Vertex verwendet, da wird OpenGL nicht mitteilen, dass wir die Farbe für jeden Vertex ändern wollen. Das Ergebnis... ein solides blaues Rechteck. Erneut wird das Rechteck (Viereck) im Uhrzeigersinn gezeichnet, was heißt das wir wieder auf dir Rückseite des Quadrats sehen.

    glColor3f(0.5f,0.5f,1.0f);                // Setzt die Farbe auf Blau
    glBegin(GL_QUADS);                // Fange an Quadrate zu zeichnen
        glVertex3f(-1.0f, 1.0f, 0.0f);            // links und eine Einheit nach oben (oben links)
        glVertex3f( 1.0f, 1.0f, 0.0f);            // rechts und eine Einheit nach oben (oben rechts)
        glVertex3f( 1.0f,-1.0f, 0.0f);            // rechts und eine Einheit runter (unten rechts)
        glVertex3f(-1.0f,-1.0f, 0.0f);            // links und eine Einheit nach unten (unten links)
    glEnd();                        // Fertig mit Quadraten zeichnen
    return TRUE;                    // Weiter machen
}

Zu guter letzt ändern Sie den Code um zwischen Fenster- und Fullscreen-Modus zu wechseln, so dass der Titel des Fensters korrekt ist.

            if (keys[VK_F1])            // Wurde F1 gedrückt?
            {
                keys[VK_F1]=FALSE;    // Wenn ja, setze Taste auf FALSE
                KillGLWindow();        // Kill unser aktuelles Fenster
                fullscreen=!fullscreen;    // Wechsel zwischen Fullscreen und Fester-Modus
            // Erzeuge unser OpenGL-Fenster neu ( Modifiziert )
                if (!CreateGLWindow("NeHe's Color Tutorial",640,480,16,fullscreen))
                {
                    return 0;        // Beenden, wenn das Fenster nicht erzeugt wurde
                }
            }

In diesem Tutorial habe ich versucht so detailiert wie möglich zu beschreiben, wie Sie Ihre OpenGL Polygone mittels Flat- und Smooth-Coloring färben können. Spielen Sie ein wenig mit dem Code herum, versuchen Sie die Rot, Grün und Blau Werte durch andere Zahlen zu ersetzen. Schauen Sie, welche Farben dabei herauskommen. Wenn Sie Kommentare oder Fragen haben, schreiben Sie mir bitte eine E-Mail. Wenn Sie denken, ich habe etwas unkorrekt kommentiert, oder das der Code irgendwo besser gemacht werden könnte, lassen Sie mich es bitte wissen. Ich möchte das beste OpenGL-Tutorial machen. Ich bin an Ihrem Feedback interessiert.

Jeff Molofee (NeHe)

* DOWNLOAD Visual C++ Code für diese Lektion.

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

---

Deutsche Übersetzung: Joachim Rohde
Der original Text ist hier zu finden.
Die original OpenGL Tutorials stammen von NeHe's Seite.