1. 图形渲染基础：计算机图形学概述、渲染管线与坐标变换
各位同学，咱们今天正式开讲。图形渲染，说白了就是让计算机把一堆数字变成你能看到的画面。我做了这么多年桌面应用开发，最深的感触就是——不懂渲染，你做的界面永远差那么点意思。
1.1 计算机图形学到底在讲什么？
计算机图形学，不是教你怎么用Photoshop，也不是教你怎么建模。它研究的是：如何用数学和算法，在屏幕上生成图像。
我刚开始接触这行时，以为图形学就是画个三角形、搞个纹理贴图。后来才发现，这里面藏着整个数字世界的底层逻辑。你想想看，从游戏里的3D角色，到CAD软件里的机械零件，再到你桌面应用里的各种特效——背后全是图形学的功劳。
核心要点：图形学解决的是「从数据到像素」的转换问题。你给计算机一个三维模型，它得知道怎么把它变成二维屏幕上的颜色值。
我个人习惯把图形学分成三大块：
- 建模——怎么描述一个物体的形状（点、线、面、体）
- 渲染——怎么把模型变成图像（光照、纹理、阴影）
- 交互——怎么让用户操作这些图像（鼠标、键盘、触控）
咱们这门课，重点放在渲染上。因为桌面应用的图形开发，最核心的就是渲染管线。
1.2 渲染管线：从数据到像素的流水线
渲染管线，你可以把它想象成一条工厂流水线。原材料是顶点数据、纹理、光照信息，经过一道道工序，最终产出屏幕上的像素。
我在项目中遇到过不少新手，一上来就调Shader，结果画面乱七八糟。为什么？因为他们根本不理解管线里每一步在干什么。
1.2.1 固定管线 vs 可编程管线
先说说历史。早期的显卡，功能是固定的。你只能通过设置一些参数来控制渲染效果，比如光照类型、纹理混合模式。这就是固定管线。
固定管线的好处是简单，你调几个API参数就行。但坏处也很明显——你想实现个自定义效果？对不起，硬件不支持。
后来显卡越来越强，就出现了可编程管线。你可以自己写Shader（着色器程序），控制顶点怎么变换、像素怎么着色。这就像从「只能点菜」变成了「可以自己下厨」。
| 对比项 | 固定管线 | 可编程管线 |
|---|---|---|
| 灵活性 | 低，只能调参数 | 高，可以写自定义Shader |
| 性能 | 固定逻辑，优化好 | 取决于Shader质量 |
| 学习曲线 | 平缓 | 陡峭，需要懂图形学原理 |
| 现代应用 | 基本淘汰 | 主流方案 |
注意：虽然固定管线已经被淘汰，但我建议你还是了解一下它的流程。因为可编程管线的很多概念，都是从固定管线演变过来的。我曾经见过有人连「光栅化」是什么都不知道，就开始写Fragment Shader——这就像没学过加减法就想解微积分。
1.2.2 可编程管线的核心阶段
现代可编程管线，主要分这么几步：
- 顶点着色器（Vertex Shader）——处理每个顶点，做坐标变换、顶点属性计算
- 几何着色器（Geometry Shader）——可选阶段，可以增删顶点，生成新几何体
- 光栅化（Rasterization）——把顶点数据变成像素片段
- 片段着色器（Fragment Shader）——计算每个像素的颜色
- 输出合并（Output Merger）——处理深度测试、模板测试、颜色混合
嗯，这里要注意：顶点着色器和片段着色器是必须的，其他都是可选。你写Shader时，至少得提供这两个。
1.3 坐标系统与变换：让物体动起来
好了，现在你知道渲染管线是怎么回事了。但还有个关键问题——你怎么告诉计算机，一个物体该放在哪里、怎么旋转、从哪个角度看？
这就涉及到坐标系统与变换。说白了，就是一套数学规则，让物体在三维空间里「听话」。
1.3.1 四个坐标空间
在图形学里，一个物体从模型到屏幕，要经过四个坐标空间：
- 模型空间（Model Space）——物体自己的坐标系，原点通常在物体中心
- 世界空间（World Space）——所有物体共享的全局坐标系
- 视图空间（View Space）——以相机为原点的坐标系
- 裁剪空间（Clip Space）——经过投影变换后的坐标系，用于判断哪些部分可见
我刚开始学的时候，总觉得这四个空间太抽象。后来做项目时，调试一个模型位置不对的问题，才发现——原来是模型空间和世界空间的变换矩阵搞反了。从那以后，我再也不敢轻视这些基础概念。
1.3.2 模型、视图、投影矩阵
这三个矩阵，是图形学里最核心的变换工具。你想想看，一个物体从模型空间到屏幕，每一步都需要一个矩阵来「翻译」：
- 模型矩阵（Model Matrix）——把顶点从模型空间变换到世界空间。包括平移、旋转、缩放。
- 视图矩阵（View Matrix）——把顶点从世界空间变换到视图空间。说白了，就是模拟相机的位置和朝向。
- 投影矩阵（Projection Matrix）——把顶点从视图空间变换到裁剪空间。分为透视投影（近大远小）和正交投影（没有透视效果）。
小技巧：我个人习惯在代码里把这三个矩阵分开维护，而不是合并成一个。虽然合并后性能更好，但分开维护方便调试。你想想看，如果画面显示不对，你可以分别检查每个矩阵是否正确，而不是面对一个巨大的矩阵一头雾水。
下面是一个简单的顶点着色器代码示例，展示了这三个矩阵的用法：
// 顶点着色器示例（GLSL）
#version 330 core
layout (location = 0) in vec3 aPos; // 顶点位置（模型空间）
layout (location = 1) in vec3 aColor; // 顶点颜色
uniform mat4 model;
uniform mat4 view;
uniform mat4 projection;
out vec3 ourColor;
void main()
{
// 注意顺序：先模型，再视图，最后投影
gl_Position = projection * view * model * vec4(aPos, 1.0);
ourColor = aColor;
}注意看代码里的乘法顺序。矩阵乘法不满足交换律，projection * view * model 这个顺序是固定的。我曾经见过有人写反了，结果模型飞到屏幕外面去了——嗯，这种坑踩过一次就记住了。
1.3.3 透视投影 vs 正交投影
这两个投影方式，区别很明显：
- 透视投影——模拟人眼效果，近大远小。适合3D游戏、仿真。
- 正交投影——没有透视效果，物体大小不随距离变化。适合2D界面、CAD图纸。
我做桌面应用时，经常在同一个场景里混用两种投影。比如3D模型用透视投影，UI元素用正交投影。这样既能保证3D效果的真实感，又能让UI保持清晰。
避坑指南：我曾经在项目里遇到过一个bug——透视投影的远平面设置得太近，导致远处的模型被裁剪掉了。排查了半天才发现是投影矩阵的参数问题。所以，设置投影矩阵时，近平面和远平面的值一定要合理。近平面别设成0，远平面别设得太小。
1.4 本章小结
这一章，咱们聊了图形学的基本概念、渲染管线的演变、以及坐标变换的核心矩阵。说白了，这些都是图形渲染的「地基」。地基打不牢，后面盖什么楼都容易塌。
下一章，我会带你深入顶点着色器和片段着色器，看看它们到底是怎么工作的。到时候，咱们会写一些实际的Shader代码，让画面真正动起来。
记住：图形学不是背公式，而是理解「为什么」。你每搞懂一个概念，就离写出漂亮的桌面应用更近一步。