OpenGL ist ein leistungsstarkes 3D-Programmierwerkzeug zum Zeichnen komplexer dreidimensionaler Szenen aus einfachen Grundelementen. In diesem Artikel erfahren Sie, wie Sie einen einfachen Würfel zeichnen, den Sie drehen können, um ihn in drei Dimensionen anzuzeigen!
Für dieses Projekt benötigen Sie einen Code-Editor und einige Kenntnisse in der C-Programmierung.
Schritte
Teil 1 von 3: Ersteinrichtung
Schritt 1. OpenGL installieren Folgen Sie diesen Schritten, um OpenGL auf Ihrem System zu installieren
Wenn Sie bereits OpenGL sowie einen kompatiblen C-Compiler installiert haben, können Sie diesen Schritt überspringen und mit dem nächsten fortfahren.
Schritt 2. Erstellen Sie das Dokument
Erstellen Sie eine neue Datei in Ihrem bevorzugten Code-Editor und speichern Sie sie als mycube.c
Schritt 3. Fügen Sie #includes hinzu
Dies sind die grundlegenden beinhaltet, die Sie für Ihr Programm benötigen. Es ist wichtig zu erkennen, dass für die verschiedenen Betriebssysteme tatsächlich unterschiedliche Includes erforderlich sind. Stellen Sie sicher, dass Sie all dies einschließen, um sicherzustellen, dass Ihr Programm vielseitig ist und für jeden Benutzer ausgeführt werden kann.
// Enthält #include #include #include #define GL_GLEXT_PROTOTYPES #ifdef _APPLE_ #include #else #include #endif
Schritt 4. Fügen Sie Funktionsprototypen und globale Variablen hinzu
Ihr nächster Schritt besteht darin, einige Funktionsprototypen zu deklarieren.
// Funktionsprototypen void display(); void specialKeys(); // Globale Variablen double rotate_y=0; Doppelrotation_x=0;
Schritt 5. Richten Sie die main()-Funktion ein
int main(int argc, char* argv){// GLUT initialisieren und Benutzerparameter verarbeiten glutInit(&argc, argv); // Doppelt gepuffertes Echtfarbenfenster mit Z-Puffer anfordern glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH);
Schritt 6. Erstellen Sie das Fenster
Der nächste Schritt ist zu erstelle das fenster in dem Sie den Würfel zeichnen. In diesem Tutorial heißt das Fenster "Awesome Cube".
// Fenster erstellen glutCreateWindow("Awesome Cube");
Schritt 7. Aktivieren Sie den Tiefentest
OpenGL ist insofern eine strenge Sprache, als es nicht davon ausgeht, dass spezielle Funktionen aktiviert sind. Damit Ihr Programm unter Verwendung des zuvor betrachteten Z-Puffers in 3 Dimensionen richtig angezeigt wird, müssen Sie Tiefentest aktivieren. Wenn Sie OpenGL weiter erkunden, werden Sie viele Funktionen entdecken, die Sie aktivieren müssen, einschließlich Beleuchtung, Texturen, Cull-Facing und vieles mehr.
// Z-Puffer-Tiefentest aktivieren glEnable(GL_DEPTH_TEST);
Schritt 8. Fügen Sie Rückruffunktionen hinzu
Hier sind die Callback-Funktionen, für die Sie zuvor die Prototypen geschrieben haben. Jedes Mal, wenn die Hauptschleife durchlaufen wird, werden diese Funktionen aufgerufen. Die Anzeigefunktion zeichnet die Szene basierend auf Änderungen an Variablen, die seit dem vorherigen Aufruf vorgenommen wurden, neu. Die Funktion specialKeys ermöglicht es uns, mit dem Programm zu interagieren.
// Callback-Funktionen glutDisplayFunc(display); glutSpecialFunc(specialKeys);
Schritt 9. Starten Sie den MainLoop
Dadurch wird die Hauptfunktion aufgerufen, bis Sie das Programm schließen, um Animationen und Benutzerinteraktionen zu ermöglichen.
// Kontrolle an GLUT für Ereignisse übergeben glutMainLoop(); // Rückkehr zum Betriebssystem Rückkehr 0; }
Teil 2 von 3: Die display()-Funktion
Schritt 1. Verstehen Sie den Zweck dieser Funktion
Die ganze Arbeit zum Zeichnen Ihres Würfels wird in dieser Funktion erledigt. Die Grundidee Ihres Würfels besteht darin, alle sechs Seiten einzeln zu zeichnen und an der entsprechenden Position zu platzieren.
Konzeptionell wird jede Seite gezeichnet, indem die vier Ecken definiert werden und OpenGL die Linien verbinden und mit einer von Ihnen definierten Farbe ausfüllen lässt. Nachfolgend finden Sie die Schritte dazu
Schritt 2. Fügen Sie glClear() hinzu
Der erste Schritt, den Sie in dieser Funktion ausführen müssen, ist, lösche die Farbe und den Z-Puffer. Ohne diese Schritte sind die alten Zeichnungen möglicherweise noch unter den neuen Zeichnungen sichtbar und die gezeichneten Objekte würden sich nicht an der richtigen Position auf dem Bildschirm befinden.
void display(){ // Bildschirm und Z-Puffer löschen glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
Schritt 3. Fügen Sie glBegin() und glEnd() hinzu
OpenGL definiert Objekte als Kombinationen verschiedener Polygone. Verwendung der glBegin() Befehl, legen Sie effektiv einen Bleistift ab, der eine Form zeichnet. Um den Bleistift anzuheben und eine neue Form zu beginnen, müssen Sie die glEnd() Befehl. In diesem Tutorial verwenden Sie GL_POLYGON, um jede Seite des Würfels zu zeichnen, aber es ist möglich, andere Parameteroptionen wie GL_LINE, GL_QUAD oder GL_TRIANGLE zu verwenden, um andere Formen zu erstellen.
- Hier beginnen Sie mit der Vorderseite Ihres Würfels. Später werden Sie allen 6 Seiten Farbe hinzufügen.
// Mehrfarbige Seite - FRONT glBegin(GL_POLYGON); // Vertices werden im nächsten Schritt hinzugefügt glEnd();
Schritt 4. Fügen Sie glVertex3f() hinzu
Sobald Sie angegeben haben, dass Sie mit Ihrem Polygon beginnen möchten, müssen Sie Definiere die Scheitelpunkte des Objekts. glVertex hat mehrere Formen, je nachdem, was Sie mit Ihrem Objekt machen möchten.
- Die erste ist, in wie vielen Dimensionen Sie arbeiten. Die 3 oben in glVertex3f besagt, dass Sie in 3 Dimensionen zeichnen. Es ist auch möglich in 2 oder 4 Dimensionen zu arbeiten. Das obige f in glVertex3f besagt, dass Sie mit Gleitkommazahlen arbeiten. Sie können auch Shorts, Integer oder Doubles verwenden.
- Beachten Sie, dass diese Punkte in a. definiert sind gegen den Uhrzeigersinn Benehmen. Dies ist im Moment nicht sehr wichtig, aber wenn Sie beginnen, mit Beleuchtung, Texturen und Cull-Facing zu arbeiten, wird dies unglaublich wichtig. Gewöhnen Sie sich also daran, Ihre Punkte jetzt gegen den Uhrzeigersinn zu definieren.
- Fügen Sie die Scheitelpunkte zwischen den Zeilen glBegin() und glEnd() hinzu.
// Mehrfarbige Seite - FRONT glBegin(GL_POLYGON); glVertex3f(-0.5, -0.5, -0.5); // P1 glVertex3f(-0.5, 0.5, -0.5); // P2 glVertex3f(0.5, 0.5, -0.5); // P3 glVertex3f(0.5, -0.5, -0.5); // P4 glEnd();
Schritt 5. Fügen Sie glColor3f() hinzu
glColor funktioniert ähnlich wie glVertex. Sie können Punkte als Shorts, Integer, Doubles oder Floats definieren. Jede Farbe hat einen Wert von 0 bis 1. Alle Nullen machen den Punkt schwarz und alle Einsen machen den Punkt weiß. Die 3 in glColor3f() bezieht sich auf das RGB-Farbsystem ohne Alphakanal. Das Alpha einer Farbe definiert ihre Transparenz. Um die Alpha-Stufe zu ändern, verwenden Sie glColor4f(), wobei der letzte Parameter ein Wert von 0 bis 1 für opak bis transparent ist.
- Wenn Sie glColor3f() aufrufen, hat jeder von diesem Punkt an gezeichnete Scheitelpunkt diese Farbe. Wenn Sie also möchten, dass alle vier Scheitelpunkte rot sind, legen Sie die Farbe einfach einmal vor den glVertex3f()-Befehlen fest und alle Scheitelpunkte werden rot.
- Die unten definierte Vorderseite zeigt, wie Sie für jeden Scheitelpunkt eine neue Farbe definieren. Wenn Sie dies tun, können Sie eine interessante Eigenschaft der OpenGL-Farben sehen. Da jeder Scheitelpunkt des Polygons eine eigene Farbe hat, wird OpenGL die Farben automatisch mischen! Im nächsten Schritt wird gezeigt, wie Sie vier Scheitelpunkte mit derselben Farbe zuweisen.
//Mehrfarbige Seite - FRONT glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 0.0); glVertex3f(0,5, -0,5, -0,5); // P1 ist rot glColor3f (0.0, 1.0, 0.0); glVertex3f(0,5, 0,5, -0,5); // P2 ist grün glColor3f(0.0, 0.0, 1.0); glVertex3f(-0.5, 0.5, -0.5); // P3 ist blau glColor3f(1.0, 0.0, 1.0); glVertex3f(-0.5, -0.5, -0.5); // P4 ist lila glEnd();
Schritt 6. Behandeln Sie die anderen Seiten
Berechnen Sie die Position jedes Scheitelpunkts für die anderen fünf Seiten des Würfels, aber der Einfachheit halber wurden diese für Sie berechnet und sind in der final display() Funktion unter.
// Weiße Seite - ZURÜCK glBegin(GL_POLYGON); glColor3f(1.0, 1.0, 1.0); glVertex3f(0,5, -0,5, 0,5); glVertex3f(0,5, 0,5, 0,5); glVertex3f(-0.5, 0.5, 0.5); glVertex3f(-0.5, -0.5, 0.5); glEnd(); // Lila Seite - RECHTS glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 1.0); glVertex3f(0,5, -0,5, -0,5); glVertex3f(0,5, 0,5, -0,5); glVertex3f(0,5, 0,5, 0,5); glVertex3f(0,5, -0,5, 0,5); glEnd(); // Grüne Seite - LINKS glBegin(GL_POLYGON); glColor3f(0.0, 1.0, 0.0); glVertex3f(-0.5, -0.5, 0.5); glVertex3f(-0.5, 0.5, 0.5); glVertex3f(-0.5, 0.5, -0.5); glVertex3f(-0.5, -0.5, -0.5); glEnd(); // Blaue Seite - TOP glBegin(GL_POLYGON); glColor3f(0.0, 0.0, 1.0); glVertex3f(0,5, 0,5, 0,5); glVertex3f(0,5, 0,5, -0,5); glVertex3f(-0.5, 0.5, -0.5); glVertex3f(-0.5, 0.5, 0.5); glEnd(); // Rote Seite - UNTEN glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 0.0); glVertex3f(0,5, -0,5, -0,5); glVertex3f(0,5, -0,5, 0,5); glVertex3f(-0.5, -0.5, 0.5); glVertex3f(-0.5, -0.5, -0.5); glEnd(); glFlush(); glutSwapBuffers(); }
Wir möchten auch zwei letzte Codezeilen für diese Funktion hinzufügen. Diese sind glFlush();
und glutSwapBuffers();
die uns den Doppelpuffereffekt geben, den Sie zuvor kennengelernt haben.
Teil 3 von 3: Benutzerinteraktivität
Schritt 1. Fügen Sie specialKeys() hinzu
Sie sind fast fertig, aber im Moment können Sie einen Würfel zeichnen, haben aber keine Möglichkeit, ihn zu drehen. Dazu wirst du Erstellen Sie eine specialKeys() Funktion, damit wir die Pfeiltasten drücken und den Würfel drehen können!
- Aus diesem Grund haben Sie die globalen Variablen rotate_x und rotate_y deklariert. Wenn Sie die rechte und linke Pfeiltaste drücken, wird rotate_y um 5 Grad inkrementiert oder dekrementiert. Wenn Sie die Pfeiltasten nach oben und unten drücken, ändert sich rotate_x entsprechend.
void specialKeys(int key, int x, int y) {// Pfeil nach rechts - Drehung um 5 Grad erhöhen if (key == GLUT_KEY_RIGHT) rotation_y += 5; // Pfeil nach links - Drehung um 5 Grad verringern else if (key == GLUT_KEY_LEFT) rotation_y -= 5; sonst if (Schlüssel == GLUT_KEY_UP) rotation_x += 5; sonst if (Taste == GLUT_KEY_DOWN) rotation_x -= 5; // Anzeige-Update anfordern glutPostRedisplay(); }
Schritt 2. Fügen Sie glRotate() hinzu
Ihre letzte Anweisung besteht darin, die Anweisung hinzuzufügen, die Ihr Objekt dreht. Gehen Sie zurück zur Funktion display() und fügen Sie vor der FRONT-Seite diese Zeilen hinzu:
// Transformationen zurücksetzen glLoadIdentity(); // Rotieren, wenn der Benutzer rotate_x und rotate_y ändert glRotatef(rotate_x, 1.0, 0.0, 0.0); glRotatef(rotate_y, 0.0, 1.0, 0.0); // Mehrfarbige Seite - FRONT ….
Schritt 3. Fügen Sie die folgenden Befehle hinzu, um den Würfel um 2 entlang der x-Achse, 2 entlang der y-Achse zu skalieren, den Würfel um 180 Grad um die y-Achse zu drehen und den Würfel um 0,1 entlang der x-Achse zu verschieben
Stellen Sie sicher, dass Sie diese sowie die vorherigen glRotate()-Befehle in der richtigen Reihenfolge wie oben beschrieben anordnen. (Wenn Sie sich nicht sicher sind, geschieht dies im endgültigen Code am Ende des Tutorials.)
// Andere Transformationen glTranslatef(0.1, 0.0, 0.0); glRotatef(180, 0.0, 1.0, 0.0); glScalef (2.0, 2.0, 0.0);
Schritt 4. Kompilieren Sie Ihren Code und führen Sie ihn aus
Angenommen, Sie verwenden gcc als Compiler, führen Sie diese Befehle von Ihrem Terminal aus aus, um Ihr Programm zu kompilieren und zu testen.
Unter Linux: gcc cube.c -o cube -lglut -lGL./ mycube Unter Mac: gcc -o foo foo.c -framework GLUT -framework OpenGL./ mycube Unter Windows: gcc -Wall -ofoo foo.c -lglut32cu - lglu32 -lopengl32./ mycube
Schritt 5. Überprüfen Sie Ihren vollständigen Code
Es sollte so sein:
// // Datei: mycube.c // Autor: Matt Daisley // Erstellt: 25.04.2012 // Projekt: Quellcode für Make a Cube in OpenGL // Beschreibung: Erstellt ein OpenGL-Fenster und zeichnet einen 3D-Würfel / / Dass der Benutzer mit den Pfeiltasten drehen kann // // Steuerung: Linkspfeil - Nach links drehen // Rechtspfeil - Nach rechts drehen // Pfeil nach oben - Nach oben drehen // Pfeil nach unten - Nach unten drehen // ------ -------------------------------------------------- -- // Beinhaltet // ------------------------------------------------------- -------------- #include #include #include #define GL_GLEXT_PROTOTYPES #ifdef _APPLE_ #include #else #include #endif // ------------- ---------------------------------------------------------- // Funktionsprototypen / / -------------------------------------------------- --------- Leere Anzeige(); void specialKeys(); // ------------------------------------------------ ---------- // Globale Variablen // ---------------------------------- ------------------------ Doppelrotation_y=0; Doppelrotation_x=0; // ------------------------------------------------ ---------- // display() Callback-Funktion // ------------------------------ --------------------------------------- void display(){ // Bildschirm und Z-Puffer löschen glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT); // Transformationen zurücksetzen glLoadIdentity(); // Andere Transformationen // glTranslatef(0.1, 0.0, 0.0); // Nicht enthalten // glRotatef(180, 0.0, 1.0, 0.0); // Nicht enthalten // Rotieren, wenn der Benutzer rotate_x und rotate_y ändert glRotatef(rotate_x, 1.0, 0.0, 0.0); glRotatef(rotate_y, 0.0, 1.0, 0.0); // Andere Transformationen // glScalef(2.0, 2.0, 0.0); // Nicht enthalten //Mehrfarbige Seite - FRONT glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 0.0); glVertex3f(0,5, -0,5, -0,5); // P1 ist rot glColor3f (0.0, 1.0, 0.0); glVertex3f(0,5, 0,5, -0,5); // P2 ist grün glColor3f(0.0, 0.0, 1.0); glVertex3f(-0.5, 0.5, -0.5); // P3 ist blau glColor3f(1.0, 0.0, 1.0); glVertex3f(-0.5, -0.5, -0.5); // P4 ist lila glEnd(); // Weiße Seite - ZURÜCK glBegin(GL_POLYGON); glColor3f(1.0, 1.0, 1.0); glVertex3f(0,5, -0,5, 0,5); glVertex3f(0,5, 0,5, 0,5); glVertex3f(-0.5, 0.5, 0.5); glVertex3f(-0.5, -0.5, 0.5); glEnd(); // Lila Seite - RECHTS glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 1.0); glVertex3f(0,5, -0,5, -0,5); glVertex3f(0,5, 0,5, -0,5); glVertex3f(0,5, 0,5, 0,5); glVertex3f(0,5, -0,5, 0,5); glEnd(); // Grüne Seite - LINKS glBegin(GL_POLYGON); glColor3f(0.0, 1.0, 0.0); glVertex3f(-0.5, -0.5, 0.5); glVertex3f(-0.5, 0.5, 0.5); glVertex3f(-0.5, 0.5, -0.5); glVertex3f(-0.5, -0.5, -0.5); glEnd(); // Blaue Seite - TOP glBegin(GL_POLYGON); glColor3f(0.0, 0.0, 1.0); glVertex3f(0,5, 0,5, 0,5); glVertex3f(0,5, 0,5, -0,5); glVertex3f(-0.5, 0.5, -0.5); glVertex3f(-0.5, 0.5, 0.5); glEnd(); // Rote Seite - UNTEN glBegin(GL_POLYGON); glColor3f(1.0, 0.0, 0.0); glVertex3f(0,5, -0,5, -0,5); glVertex3f(0,5, -0,5, 0,5); glVertex3f(-0.5, -0.5, 0.5); glVertex3f(-0.5, -0.5, -0.5); glEnd(); glFlush(); glutSwapBuffers(); } // ------------------------------------------------------------ -------------- // specialKeys() Callback-Funktion // ------------------------------ ---------------------------------------- void specialKeys(int key, int x, int y) { // Pfeil nach rechts - Rotation um 5. erhöhen Grad if (Taste == GLUT_KEY_RIGHT) rotation_y += 5; // Pfeil nach links - Drehung um 5 Grad verringern else if (key == GLUT_KEY_LEFT) rotation_y -= 5; sonst if (Schlüssel == GLUT_KEY_UP) rotation_x += 5; sonst if (Taste == GLUT_KEY_DOWN) rotation_x -= 5; // Anzeige-Update anfordern glutPostRedisplay(); } // ------------------------------------------------------------ ----------- // Hauptfunktion // ------------------------------- --------------------------- int main(int argc, char* argv){ // Initialisieren Sie GLUT und verarbeiten Sie Benutzerparameter glutInit(&argc, argv); // Double Buffered True Color Window mit Z-Buffer anfordern glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH); // Fenster erstellen glutCreateWindow("Awesome Cube"); // Z-Puffer-Tiefentest aktivieren glEnable(GL_DEPTH_TEST); // Callback-Funktionen glutDisplayFunc(display); glutSpecialFunc(specialKeys); // Kontrolle an GLUT für Ereignisse übergeben glutMainLoop(); // Rückkehr zum Betriebssystem Rückkehr 0; }
