OpenGL ES 2.0: настройка 2D-проекции

15

В этой статье описывается, как рисовать четкую 2D-графику OpenGL, используя фиксированный конвейер функций.

Поскольку в OpenGL ES 2.0 некоторые функции ES 1.x недоступны (например, glOrtho ()), их функциональность должна быть заменена в шейдерах Fragment / Vertex.

Мой вопрос, как настроить следующую 2D-проекцию в конвейере программируемой функции?

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

Как должны быть настроены Фрагментные и Вершинные шейдеры, чтобы полностью заменить вышеупомянутую фиксированную функцию 2D проекции?

Bunkai.Satori
источник

Ответы:

12

В моем движке OpenGL ES 2.X я вычисляю матрицу MVP (проекция вида модели) на стороне процессора и внедряю ее в вершинный шейдер.

Ортогональная проекция представляет собой матрицу 4 * 4 . Когда у меня есть MVP, я внедряю его в вершинный шейдер с помощью:

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

MMvp - это моя матрица 4 * 4 на стороне процессора. GetUniformLocation можно выполнить только один раз после загрузки программного шейдера.

Пример вершинного шейдера:

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

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

Gl_Position - это специальная предопределенная переменная. Он должен содержать положение вершины.

Пример фрагмента шейдера. Для каждой нарисованной точки необходимо вычислить окончательный цвет "gl_FragColor":

#ifdef GL_ES
precision highp float;
#endif

void main(void)
{
   gl_FragColor = vColor;
}

Эта программа рисует треугольник со сглаживанием цветов, определенных для каждой вершины.

Для лучшего руководства посмотрите этот замечательный документ.

Эллис
источник
Привет Эллис, это отличный и полный ответ. Большое спасибо. С уважением.
Bunkai.Satori
9

Из документа glOrtho, с замененными значениями:

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

Сохраните эту матрицу в униформе, и затем вы сможете применить ее (т.е. сделать произведение M. V) к вашим входящим позициям вершин.

Bahbar
источник
Уважаемый Bahbar, Спасибо за ответ. Так что, в принципе, в ES2.0 нет ничего иного, просто создание замены матрицы glOrtho () вручную.
Bunkai.Satori
@ Bunkai.Satori: Ну, есть немного больше в этом, как правило, GL загружает смесь вида модели и проекции на униформу.
Bahbar