OpenGL ES 渲染流程
1、总体流程
渲染总体流程
2、流程细节
2.1、顶点着色器
-
顶点着色器的输入
- 着色器程序：描述顶点上执行操作的顶点着色器程序源代码/可执行文件
- 顶点着⾊器输入(属性)：用顶点数组提供每个顶点的数据
- 统一变量(uniform)：顶点/片元着⾊器使用的不变数据
- 采样器：代表顶点着色器使用纹理的特殊统一变量类型，一般是
ID类型，GLSL会根据ID标签查找到纹理
-
顶点着色器业务
- 矩阵变换位置
- 计算光照公式生成逐顶点颜色
- 生成/变换纹理坐标
-
顶点着色器代码示例
// 属性 -- 顶点坐标 四维向量 attribute vec4 position; // 属性 -- 纹理坐标 二维向量 attribute vec2 textCoordinate; // uniform 旋转矩阵 uniform mat4 rotateMatrix; // varying变量是vertex和fragment shader之间做数据传递用的，并且OpenGL ES会对其进行线性插值 varying lowp vec2 varyTextCoord; void main() { varyTextCoord = textCoordinate; vec4 vPos = position; vPos = vPos * rotateMatrix; // 输出 gl_Position = vPos; }
2.2、图元装配
图元(Primitive)：点、线、三角形等.
图元装配：将顶点数据计算成一个个图元，在这个阶段会执行裁剪、透视分割和Viewport变换操作。
图元类型和顶点索引确定将被渲染的单独图元.
对于每个图元及其对应的顶点,图元装配阶段执行的操作包括: 将顶点着色器的输出值执行裁剪,透视分割,视口变化后进入光栅化阶段.
2.3、光栅化
- 绘制对应的图片(点、线、三角形)，将图元转化成一组二维片段的过程，就是将顶点数据计算成的图片转化成片元，然后这些片元由片元着色器处理。
2.4、片元着色器
-
片元着色器的输入：
- 着色器程序 -- 描述片段上执行操作的片元着色器程序源代码/可执行文件。
- 输入变量 -- 光栅化单元用插值为每个片段生成的顶点着色器输出
- 统一变量(uniform) -- 顶点或片元着色器使用的不变数据
- 采样器 -- 代表片元着色器使用纹理的特殊统一变量类型
-
片元着色器的业务：
- 计算颜色
- 获取纹理值
- 往像素点中填充颜色值(纹理值/颜色值)
-
代码示例：
// 纹理坐标:从顶点着色器传递过来,定义命名/类型要一致. varying lowp vec2 varyTextCoord; // 纹理采样器 uniform sampler2D colorMap; void main() { // 输出值 -- gl_FragColor // texture2D(纹理采样器, 纹理坐标) -- 获取纹理像素 gl_FragColor = texture2D(colorMap, varyTextCoord); }
