OpenGL ES 2.0: Menyiapkan Proyeksi 2D

15

Artikel ini menjelaskan secara umum, cara menggambar grafik OpenGL 2D yang tajam, menggunakan pipeline fungsi tetap.

Karena OpenGL ES 2.0 memiliki beberapa fungsi ES 1.x tidak tersedia (seperti: glOrtho ()), fungsinya harus diganti dalam Fragment / Vertex shaders.

Pertanyaan saya adalah, bagaimana cara mengatur proyeksi 2D berikut dalam pipeline fungsi yang dapat diprogram?

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

Bagaimana Fragment dan Vertex shaders harus dikonfigurasi untuk sepenuhnya menggantikan pengaturan proyeksi fungsi 2D yang disebutkan di atas?

Bunkai.Satori
sumber

Jawaban:

12

Dalam mesin OpenGL ES 2.X saya, saya menghitung matriks MVP (Model View Projection) pada Sisi CPU dan menyuntikkannya dalam vertex shader.

Proyeksi Orthogonal adalah matriks 4 * 4 . Ketika saya memiliki MVP, saya menyuntikkannya di vertex shader dengan:

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

MMvp adalah matriks saya 4 * 4 di sisi CPU. GetUniformLocation dapat dilakukan hanya satu kali setelah Anda memuat program shader.

Contoh vertex shader:

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

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

Gl_Position adalah variabel standar yang ditentukan sebelumnya. Itu harus mengandung posisi titik.

Contoh shader fragmen. Untuk setiap titik untuk menggambar, warna akhir "gl_FragColor" harus dihitung:

#ifdef GL_ES
precision highp float;
#endif

void main(void)
{
   gl_FragColor = vColor;
}

Program ini menggambar segitiga dengan menghaluskan warna yang ditentukan untuk setiap titik.

Untuk tutorial yang lebih baik, lihat dokumen yang luar biasa ini.

Ellis
sumber
Halo Ellis, ini jawaban yang sangat bagus dan lengkap. Terima kasih banyak. Salam.
Bunkai.Satori
9

Dari doc glOrtho, dengan nilai yang diganti:

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

Simpan matriks ini dalam seragam, dan Anda kemudian dapat menerapkannya (mis. Lakukan produk M. V) ke posisi verteks yang masuk.

Bahbar
sumber
Dear Bahbar, Terima kasih atas jawabannya. Jadi pada dasarnya, tidak ada yang berbeda dalam ES2.0, hanya secara manual membuat penggantian glOrtho () matriks.
Bunkai.Satori
@ Bunkai.Satori: Ya, ada sedikit lebih banyak dalam hal itu, GL mengunggah gabungan modelview dan proyeksi ke seragam.
Bahbar