在上一篇文章里图示展示了OpenGL ES 2.x渲染管线步骤，它与OpenGL EX 1.x的不同就是两个着色器的使用——顶点着色器和片元着色器。

本篇文章就记录顶点着色器和片元着色器相关概念。

---

顶点着色器和片元着色器都是可编程的单元，是一组指令代码，它们使用OpenGL ES着色语言编写。

1. 顶点着色器

1.1 示例代码

uniform mat4 uMVPMatrix;//总变换矩阵
attribute vec3 aPosition;//顶点位置
attribute vec4 aColor;//顶点颜色
varying vec4 vColor;//用于传递给片元着色器的易变变量
void main(){
    gl_Position = uMVPMatrix * vec4(aPosition,1);//根据总变换矩阵计算此次绘制顶点的位置
    vColor = aColor;
}
1
2
3
4
5
6
7
8

1.2 功能

执行顶点的变换、光照、材质的应用等。每顶点执行一次。有了顶点着色器，显卡知道顶点应该绘制在什么位置。

1.3 工作原理示意图

• 属性变量(Attribute0):一般包括顶点的位置、颜色、法向量等信息;
• 全局变量uniforms：同一组顶点组成的单个3D物体中所有顶点都相同的量;
• 易变变量varying:从顶点着色器计算产生并传递到片元着色器的数据变量;
• 内建变量：gl_Position等以“gl_开头的”

1.4 注意！

• 顶点着色器针对每个顶点独立计算，各个顶点间没有联系；

2.片元着色器

2.1 示例代码

precision mediump float;
varying vec4 vColor;
void main(){
  gl_FragColor = vColor;
}
1
2
3
4
5

2.2 功能

用于处理片元值及相关数据，可以执行纹理的采样、颜色的汇总、计算雾颜色等。每片元执行一次。

2.3 工作原理示意图

• 易变变量varying0：从顶点传递过来的值；（注意该值是光栅化后插值产生！）
• gl_FragColor：片元颜色

3.OpenGL ES坐标系

【参考】

1. https://www.khronos.org/opengles/
2. 《OpenGL ES应用开发实践指南 Android卷 Kevin Brothaler》
3. https://en.wikipedia.org/wiki/OpenGL_ES
4. https://developer.android.google.cn/guide/topics/graphics/opengl
5. https://developer.android.google.cn/training/graphics/opengl
6. Android3D游戏开发技术宝典OpenGL ES 2.0