OpenGl ES 3.0 笔记一:初步概念
🎯 整体比喻:开一场 3D 打印画展!
想象你在做一件事情:「拿设计图,把它画在一张纸上」。
这整个流程就好像 GPU 在渲染一幅画。
而下面这几个阶段,就是这场「画展」里每个具体的人或机器要做的事情:
1. 顶点着色器(Vertex Shader)
作用:处理每一个点(顶点),决定它放在哪里、长什么样。
🧠 比喻:
就像你在设计图上标出各个点的位置。
比如「头顶在这里,手在这里」,每个点可能还有颜色、大小之类信息。
🛠 举例:
- 输入:一个三角形的三个顶点 (坐标、颜色、法线等)
- 顶点着色器:
- 乘以MVP矩阵,把本地坐标变成屏幕上的位置。
- 可以改变点的颜色、大小等。
- 输出:每个点的新位置、新属性。
✅ 记忆口诀:“点”搬到正确位置上!
2. 图元装配(Primitive Assembly)
作用:把一个个点连起来,组成「图形」比如三角形、线段。
🧠 比喻:
就像把设计图上的点用线连接起来,画出三角形、矩形、房子轮廓!
🛠 举例:
- 输入:三个顶点
- 图元装配:
- 发现这三个点要组成一个三角形
- 输出:一个确定了顶点顺序的三角形
✅ 记忆口诀:“点连成线/面”!
3. 光栅化(Rasterization)
作用:把连续的三角形变成一堆小格子(像素),决定要涂哪块。
🧠 比喻:
想象你拿一张方格纸(像素格子),用铅笔把三角形里属于的格子都涂黑。
光栅化就是在格子上“染色”!
🛠 举例:
- 输入:一个大三角形(顶点位置)
- 光栅化:
- 计算哪些像素格子在三角形内部
- 对每个像素插值颜色、纹理坐标等
- 输出:每个像素点准备好要着色的信息
✅ 记忆口诀:“面变成一堆像素点”!
4. 片段着色器(Fragment Shader)
作用:每个像素自己决定怎么最终着色。
🧠 比喻:
就像每个被铅笔点到的小格子自己决定画红的?蓝的?加纹理?加亮?
🛠 举例:
- 输入:一个像素的位置、插值后的颜色、纹理坐标
- 片段着色器:
- 查纹理,混合颜色,做光照计算
- 输出:最终这个像素的颜色(比如红色、绿色、透明度等)
✅ 记忆口诀:“每个像素自己上色”!
5. 逐片段操作(Per-Fragment Operations)
作用:最终的「管控」:裁剪、不透明度混合、写进屏幕缓存。
🧠 比喻:
就像审查员,每个格子画完后,检查一遍:
- 这个像素要不要丢掉?
- 这个像素透明吗?
- 如果是透明的,要怎么跟下面的叠加?
🛠 举例:
- 深度测试:当前片段是不是比已有的片段更靠前?
- 混合:比如透明玻璃的叠加效果。
- 模板测试:做一些遮罩效果。
✅ 记忆口诀:“最终审核决定能不能留”!
📈 总流程图示意
顶点数据↓
【顶点着色器】(点的位置、颜色)↓
【图元装配】(连接成三角形)↓
【光栅化】(确定哪些像素被覆盖)↓
【片段着色器】(每个像素自己决定颜色)↓
【逐片段操作】(测试深度/混合,决定最后显示)↓
屏幕画面
✨ 小总结记忆法
阶段 | 比喻 | 关键词 |
---|---|---|
顶点着色器 | 点的位置/初步化妆 | 定点位置 |
图元装配 | 点连成面 | 连线成形 |
光栅化 | 三角形染色 | 面转像素 |
片段着色器 | 每个像素化妆 | 颜色决定 |
逐片段操作 | 审核打分 | 能不能画 |