OpenGL ES 2.0: Einrichten der 2D-Projektion

15

In diesem Artikel wird allgemein beschrieben, wie Sie scharfe OpenGL 2D-Grafiken mithilfe einer Pipeline mit festen Funktionen zeichnen.

Da in OpenGL ES 2.0 einige ES 1.x-Funktionen nicht verfügbar sind (z. B.: glOrtho ()), muss deren Funktionalität in Fragment- / Vertex-Shadern ersetzt werden.

Meine Frage ist, wie man die folgende 2D Projektion in der programmierbaren Funktionspipeline gründet?

const XSize = 640, YSize = 480
glMatrixMode (GL_PROJECTION)
glLoadIdentity ();
glOrtho (0, XSize, YSize, 0, 0, 1)
glMatrixMode (GL_MODELVIEW)

Wie müssen Fragment- und Vertex-Shader konfiguriert werden, um die oben beschriebene 2D-Projektionskonfiguration mit festen Funktionen vollständig zu ersetzen?

Bunkai.Satori
quelle

Antworten:

12

In meiner OpenGL ES 2.X-Engine berechne ich die MVP-Matrix (Model View Projection) auf der CPU-Seite und füge sie in den Vertex-Shader ein.

Die orthogonale Projektion ist eine 4 * 4-Matrix . Wenn ich das MVP habe, injiziere ich es in den Vertex-Shader mit:

 mMvpLoc = getUniformLocation("uMvp");
 glUniformMatrix4fv(mMvpLoc, 1, false, mMvp.pointer());

Das mMvp ist meine Matrix 4 * 4 auf der CPU-Seite. Die getUniformLocation kann nur einmal ausgeführt werden, nachdem Sie den Programm-Shader geladen haben.

Ein Beispiel für einen Vertex-Shader:

uniform mat4    uMvp;
attribute vec3 aPosition;
varying vec4 vColor;

void main() {
   vec4 position = vec4(aPosition.xyz, 1.);
   gl_Position = uMvp * position;
}

Die gl_Position ist eine spezielle vordefinierte Variable. Es muss die Position des Scheitelpunkts enthalten.

Ein Beispiel für einen Fragment-Shader. Für jeden zu zeichnenden Punkt muss die endgültige Farbe "gl_FragColor" berechnet werden:

#ifdef GL_ES
precision highp float;
#endif

void main(void)
{
   gl_FragColor = vColor;
}

Dieses Programm zeichnet ein Dreieck mit einer für jeden Scheitelpunkt definierten Glättung der Farben.

Für ein besseres Tutorial schauen Sie sich dieses wundervolle Dokument an.

Ellis
quelle
Hallo Ellis, das ist eine hervorragende und vollständige Antwort. Vielen Dank. Grüße.
Bunkai.Satori
9

Aus dem glOrtho-Dokument mit ersetzten Werten:

         2
    ------------       0              0             -1
       XSize
                       2
        0         ------------        0              1
                   - Ysize
        0              0              -2            -1
        0              0              0              1

Speichern Sie diese Matrix in einer Uniform, und Sie können sie dann auf Ihre eingehenden Eckpunkte anwenden (dh das Mv-Produkt ausführen).

Bahbar
quelle
Lieber Bahbar, vielen Dank für die Antwort. Im Grunde genommen gibt es in ES2.0 nichts anderes, als die glOrtho () - Matrixersetzung manuell zu erstellen.
Bunkai.Satori
@ Bunkai.Satori: Naja, da steckt noch ein bisschen mehr dahinter. Normalerweise lädt der GL eine Komposition aus Modellansicht und Projektion auf eine Uniform hoch.
Bahbar