OpenGL入门篇

本篇，我会初步介绍OpenGL在绘图中的角色定位，以及相关专业名词的介绍。在部分专业名词后面我都附有较详细的解说连结，若为初学请先理解本篇概观，再往细节深入。

什么是OpenGL? OpenGL本质上是驱动GPU绘图的一套框架。

作为底层驱动GPU绘图的框架，OpenGL可以达到跨平台的特性。在iOS里面CoreGraphics, CoreAnimation, CoreImage计算绘图后，最后其实也是要调度OpenGL/Metal去驱动GPU绘制。同理，Android & Windows也是在调度OpenGL基础上提供绘图API给开发者使用。

OpenGL角色定位

由上图可知，所有图像最终会由OpenGL调动GPU绘制，那么问题来了，我们有什么理由需要去写底层的OpenGL而不直接用上层所提供的绘图API绘制就好了呢？

1. 效能考量：上层API主要是利用CPU资源绘图，OpenGL则是透过GPU绘图。在用途上，CPU是串行运算，善于处理依赖性高的任务、GPU是并行运算，适合处理依赖性低的任务。而屏幕上各像素点结果的运算，互相之间是不依赖的，因此OpenGL可以达到更高效的运算结果。

2. 跨平台共用：同样的著色器代码，可以同时提供android & iOS平台使用。

3. 自定义效果：上层绘图我们受限于iOS提供的API，人家没有提供的效果，我们无法实现。而OpenGl我们可以自定义著色器编写我们想要的特效。

专业名词解析

1. OpenGL 上下⽂ ( Context )

OpenGL的上下文是一个巨大的状态机。保存了OpenGL中的各种状态，也是OpenGL指令执⾏的基础。

任何画面在被呈现出来之前，都要经过一系列的渲染处理。而这渲染过程中是否开启光照计算、颜色混合、深度测试等，就是由上下文中储存的状态决定。

2. OpenGL 状态机(State Machine)

状态机可以理解为一台可以保存状态，并根据当前状态进行相应输出的机器，他具有以下特性。

• 记忆功能，保存当前状态

• 接收输入，修改当前状态，或根据当前状态进行输出

• 当进⼊特殊状态(停机状态)时，不再接收输⼊，停⽌工作

3. 顶点数组( VertexArray ) 与图元(primitive)

顶点数据决定图像的轮廓，图元装配方式决定顶点的连线方式，最终形成图元。

在OpenGL里面，图元是形成图像的基本单位，共有三种类型：点、线、三角形。

顶点只能决定位置、图元装配方式才能决定图形的样子。补充三角形图元装配方式详解

顶点数据与图元装配

5. 管线(Pipeline)

管线就是图形渲染的流程，下图为OpenGL 4.3 版本的管线。之所以称之为管线是因为显卡在处理理数据的时候是按照一个固定的顺序来的，⽽且严格按照这个顺序。

本篇中只会重点介绍 "顶点著色器" 以及 "片元著色器" ，因为实际上，目前OpenGL只开放了这两种著色器给开发者自行编程。[各著色器职责详解补充]

管线

6. 顶点着色器 (VertexShader)

顶点着⾊器是OpenGL中⽤于计算顶点属性的程序。用以呈现旋转/平移/投影等，是我们唯二能够以GLSL自定义的著色器。

顶点着⾊器是逐顶点运算的程序，也就是说每个顶点数据都会执⾏一次顶点着⾊器。当然这是并行的，并且顶点着⾊器运算过程中⽆法访问其他顶点的数据。

7. 片段着⾊器(FragmentShader)

⽚段着⾊器是OpenGL中⽤于计算⽚段(像素)颜⾊的程序。用以呈现阴影、高光、半透明、深度等，也是我们唯二能够以GLSL自定义的著色器。

⽚段着⾊器是逐像素运算的程序，也就是说每个像素都会执⾏一次⽚段着⾊器，当然也是并⾏的。

片元中的每一个元素对应帧缓冲区中的⼀像素。

片段著色器又称为片元著色器、像素著色器。

8. 光栅化(Rasterization)

顶点经过图元装配产生的图元会传给光栅器，光栅器再将图元转换为片元，这个过程称为光栅化。

这个过程包含两部分工作。第⼀部分工作：决定窗⼝坐标中的哪些整型栅格区域被基本图元占⽤；第⼆部分⼯作：分配一个颜⾊值和⼀个深度值到各个区域。示意图如下：

光栅化

9. GLSL(OpenGL Shading Language)

OpenGL著⾊語言(OpenGL Shading Language)是⽤來在OpenGL中著⾊編程的語言，即開發⼈員寫的短小的⾃定義程序，他們是在圖形卡的GPU (Graphic Processor Unit圖形處理單元)上執行的，代替了固定渲染管線的一部分，使渲染管線中不同層次具有可編程性。⽐如:視圖轉換、投影轉換等。GLSL(GL Shading Language)的著⾊器代碼分成2個部分: Vertex Shader(頂點著⾊器)和Fragment(⽚段著色器)

10. 纹理(Texture)

纹理可以理解为图⽚。 在渲染图形时需要在顶点围成的区域中填充图⽚，使得场景更加逼真。⽽这⾥使⽤的图⽚，就是常说的纹理。只是在OpenGL，我们更加习惯叫纹理，⽽不是图⽚。

11. 混合(Blending)

在测试阶段之后，如果像素依然没有被剔除，那么像素的颜⾊将会和帧缓冲区中颜⾊附着上的颜色进⾏混合，混合的算法可以通过OpenGL的函数进行指定。但是OpenGL提供的混合算法有限。如果需要更加复杂的混合算法，一般可以通过片段着⾊器进⾏实现，当然性能会⽐原⽣的混合算法差⼀些。

12.矩阵(Matrix)

矩阵是一种数据结构，是OpenGL应用来改变顶点位置的主要方式，依功能分为 "表示位置的矩阵(顶点 与 模型数据)", "表示位置如何变换的矩阵(变换矩阵)"。

OpenGL最终的顶点位置是由 投影矩阵,视图矩阵,模型矩阵 共同决定的。[矩阵章节]

最终顶点 = 投影矩阵 * 视图矩阵 * 模型矩阵 * 顶点