OpenGL入门 — MAC环境搭建

上一篇博客介绍了如何在 MAC 上搭建 OpenGL环境，接下来我们要做的就是理解一些专业的名词，以便于我们更好的学医后面的内容，可能大多数人都听过 OpenGL、OpenGL ES 、Metal、DirectX，那么他们到底是什么呢？之间又有什么关系呢？又可以用来做什么呢？接下来就为大家一一揭晓答案。

• 问题一：它们到底是什么呢？

  通俗的讲他们都是图形的API。
  OpenGL(Open Graphics Library)是⼀个跨编程语⾔言、跨平台的编程图形程序接⼝口，它将计算机的资源抽象称为⼀个OpenGL的对象，对这些资源的操作抽象为⼀个的OpenGL指令。

  OpenGL ES (OpenGL for Embedded Systems)是OpenGL三维图形API的⼦子集，针对⼿手机、 PDA和游戏主机等嵌⼊入式设备⽽而设计，去除了了许多不不必要和性能较低的API接⼝口。

  DirectX是由很多API组成的，DirectX并不不是⼀个单纯的图形API. 最重要的是DirectX是属于Windows上⼀个多媒体处理理API。并不支持Windows以外的平台，所以不是跨平台框架， 按照性 质分类，可以分为四⼤大部分，显示部分、声⾳音部分、输⼊入部分和⽹网络部分。

  Metal : Apple为游戏开发者推出了了新的平台技术Metal，该技术能够为3D图像提⾼高10倍的渲染性能。Metal是Apple为了了解决3D渲染⽽而推出的框架。

• 问题二：它们之间有什么关系呢？

  早在 2014 的WWDC上苹果正式推出Metal，作为一种低层次的渲染应用程序编程接口，在iOS 8中，Apple引入了Metal 3D图形库，保证软件可以运行在不同的图像芯片上，它在移动平台上拥有较OpenGL高达10倍的绘图性能。在iOS12.0以后，苹果便摒弃了OpenGL的相关API，转而使用Metal作为底层渲染，但是我们依旧可以使用OpenGL的相关API,因为在这之前苹果的底层渲染也是基于OpenGL/OpenGL ES的，并且提供了非常丰富的OpenGL的API。

• 问题三：它们（图形 API）可以用来解决什么问题呢？

  OpenGL/OpenGL ES/Metal在任何项目中解决问题的本质就是利用GPU芯片来高效的渲染图形图像。图形API是iOS开发者唯一接近GPU的方式。
  直观的讲就是实现图形的底层渲染。

  • 比如说在游戏开发中，对于游戏场景/游戏人物的渲染
  • 比如在音频开发中，对于视频解码后的数据渲染
  • 比如在地图引擎，对于地图上的数据渲染
  • 比如在动画中，实现动画的绘制
  • 比如在视频处理中，对于视频加入滤镜效果等

关于Open GL 的一些专业名词：

1. Open GL状态机

   从字面意思我们可以理解为一种保存对象状态的机器，并且可以根据据输入修改当前状态进行响应
   状态机特点：

• 记忆功能，保存当前状态
• 接收输入，修改当前状态，或根据当前状态进行输出
• 当进⼊特殊状态(停机状态)时，不再接收输⼊，停⽌工作

2. Open GL上下文(context)

   在应⽤程序调⽤任何OpenGL的指令之前，首先需要创建⼀个OpenGL的上下⽂文。这个上下⽂是⼀个⾮常庞⼤的状态机，保存了了OpenGL中的各种状态，这也是OpenGL指令执⾏的基础。
   OpenGL的函数不管在哪个语⾔中，都是类似C语⾔一样的面向过程的函数。本质上都是对OpenGL上下⽂这个庞⼤的状态机中的某个状态或者对象进行操作。通过对 OpenGL指令的封装，可以将OpenGL的相关调⽤封装成为⼀个⾯向对象的图形API。
   由于OpenGL上下⽂是⼀个巨⼤大的状态机，切换上下文往往会产生较⼤的开销，但是不同的绘制模块，可能需要使⽤完全独立的状态管理。因此，可以在应⽤程序中分别创建多个不同的上下文，在不同线程中使⽤不同的上下文，上下⽂之间共享纹理、缓冲区等资源。这样的⽅方案，会⽐比反复切换上下⽂，或者⼤量修改渲染状态，更加合理高效。
   要点：

   • 本质是一个保存各种状态的庞大的状态机
   • 是OpenGL指令执行的基础，需要在调用指令之前创建
   • 切换上下文开销大，多个上下文之间共享纹理、缓冲区等资源
   • 面向过程、可以将OpenGL的相关调⽤封装成为⼀个⾯向对象的图形API

3. 渲染

   将图形/图像数据通过解码，将其显示绘制到屏幕上的操作

4. 顶点数组 VertexArray/顶点缓冲区 VertexBuffer
   顶点是在绘制图像的时候顶点位置的数据，顶点数据就是图像的框架，顶点数据可以直接存储在数组中或者缓存到GPU内存中。

   OpenGL中的图像都是由图元组成。
   图元类型：

   • 点
   • 线
   • 三角形

   在调⽤绘制⽅法的时候，直接由内存传入顶点数据，也就是说这部分数据之前是存储在内存当中的，被称为顶点数组(VertexArray)。
   ⽽性能更高的做法是，提前分配⼀块显存，将顶点数据预先传⼊到显存当中。这部分的显存，就被称为顶点缓冲区(VertexBuffer)。

• 要点：
  顶点数组与顶点缓冲区的区别在于顶点数据的存储方式不同，顶点数组在内存中，而顶点缓冲区在显存中。

5. 管线
   可以想象成流⽔线，每个任务类似流⽔线般执⾏，任务之间有先后顺序。管线是⼀个抽象的概念，之所以称之为管线是因为显卡在处理数据的时候是按照一个固定的顺序来的，而且严格按照这个固定顺序执行。

6. 固定管线/存储着色器
   已经封装好的shader程序，开发者只需要传入对应的参数，就能快速完成图形的渲染。
   固定管线、存储染色器无法完成每个业务时，可以把相关业务变成可编程，可以根据实际情况自定义管线完成任务。

   什么是着色器程序呢？
   通常我们调用openGL的绘制函数的时候，需要指定一个有shader编译成的着色器。常见的着色器有：

   • 顶点着⾊器(VertexShader)
   • ⽚段着⾊器(FragmentShader)/像素着⾊器(PixelShader)
   • 几何着⾊(GeometryShader)
   • 曲⾯细分着⾊器(TessellationShader)

片段着⾊器和像素着⾊器只是在OpenGL和DirectX中的不同叫法而已。目前OpenGL只支持顶点着⾊器和片段着⾊器这两个基本着色器。

在OpenGL进行绘制的时候，⾸先由顶点着⾊器对传⼊的顶点数据进⾏运算。再通过图元装配，将顶点转换为图元。然后进⾏光栅化，将图元这种⽮量图形，转换为栅格化数据。最后，将栅格化数据传入⽚段着⾊器中进⾏运算。⽚段着⾊器会对栅格化数据中的每一个像素进行运算，并决定像素的颜⾊。

7. 顶点着⾊器(VertexShader)

   OpenGL用来处理顶点数据的程序，典型的需要计算的顶点属性主要包括顶点坐标变换、逐顶点光照运算等等，是将顶点坐标由自身坐标系转换到归一坐标系。
   重点：

   • ⽤来处理理图形每个顶点变换(旋转/平移/投影)
   • 3D图形数据 投影换算 为2D图形数据
   • 并行计算，且运算过程中⽆法访问其他顶点的数据

8. 片元(片段)着色器

   片元可以理解为屏幕当中的像素点
   ⽚元着⾊器是OpenGL中⽤于计算⽚段(像素)颜⾊的程序。一般⽤来处理图形中每个像素点颜⾊计算和填充。

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

   重点：

   • 用来处理一个个像素点的颜色计算与填充
   • 逐像素且在GPU并行运行的程序，即每个像素都会执行一次
   • 并行计算，且运算过程中⽆法访问其他顶点的数据

9. GLSL(OpenGL Shading Language)

   GLSL着色语⾔是⽤来在OpenGL中着⾊编程的语⾔，是在图形卡的GPU上执⾏的。代替了固定的渲染管线的⼀部分，使渲染管线中不同层次具有可编程性。⽐如：视图转换、投影转换等。GLSL(GL Shading Language)的着⾊器代码分成2个部分: Vertex Shader(顶点着⾊器)和Fragment(⽚断着⾊器)。

   • OpenGL中着色编程的语言
   • 可以通过GLSL自定义着色器

10. 光栅化(Rasterization)

    光栅化就是把顶点数据转换为片元的过程。具有将图转化为⼀个个栅格组成的图象 的作⽤，特点是每个元素对应帧缓冲区中的⼀像素。

    光栅化其实是⼀种将⼏何图元变为二维图像的过程。该过程包含了两部分的⼯作。第⼀部分工作：决定窗⼝坐标中的哪些整型栅格区域被基本图元占⽤；第⼆部分⼯作：分配一个颜⾊值和⼀个深度值到各个区域。

    把物体的数学描述以及与物体相关的颜色信息转换为屏幕上用于对应位置的像素及⽤于填充像素的颜⾊，这个过程称为光栅化。这是⼀个将模拟信号转化为离散信号的过程。

    重点：

    • 顶点数据 => 片元
    • 几何图元 => 二维图像
    • 把物体的数学描述和相关的颜色信息转换为屏幕上对应位置的像素及填充像素颜色
    • 将模拟信号转换为离散信号
    • 是不可编程的过程
    • 过程：1>决定窗⼝坐标中的哪些整型栅格区域被基本图元占⽤；2>分配一个颜⾊值和⼀个深度值到各个区域。

11. 纹理(Texture)

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

12. 混合(Blending)

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

13. 矩阵

    1. 变换矩阵(Transformation)：图形想发⽣平移,缩放,旋转变换时使用 。
    2. 投影矩阵(Projection)：将3D坐标转换为2D屏幕坐标时使用，实际线条也将在二维坐标下进行绘制。

14. 渲染上屏/交换缓冲区(SwapBuffer)

    渲染缓冲区⼀般映射的是系统的资源⽐如窗⼝。如果将图像直接渲染到窗口对应的渲染缓冲区，则可以将图像显示到屏幕上。

    值得注意的是，如果每个窗⼝只有⼀个缓冲区，那么在绘制过程中屏幕进⾏了刷新，窗⼝可能显示出不完整的图像。

    为了解决这个问题，常规的OpenGL程序⾄少都会有两个缓冲区。显示在屏幕上的称为屏幕缓冲区，没有显示的称为离屏缓冲区。在一个缓冲区渲染完成之后，通过将屏幕缓冲区和离屏缓冲区交换，实现图像在屏幕上显示。

    由于显示器的刷新⼀般是逐⾏进⾏的，为了防⽌交换缓冲区的时候屏幕上下区域的图像分属于两个不同的帧，交换一般会等待显示器刷新完成的信号，在显示器器两次刷新的间隔中进⾏交换，这个信号就被称为垂直同步信号，这个技术被称为垂直同步。

    使用了双缓冲区和垂直同步技术之后，由于总是要等待缓冲区交换之后再进⾏下⼀帧的渲染，使得帧率无法完全达到硬件允许的最⾼⽔平。为了解决这个问题，引⼊了三缓冲区技术。在等待垂直同步时，来回交替渲染两个离屏的缓冲区，⽽垂直同步发⽣生时，屏幕缓冲区和最近渲染完成的离屏缓冲区交换，实现充分利利⽤硬件性能的⽬的。

重点：

• 渲染缓冲区 => 系统的资源，例如窗口

• 渲染上屏 => 将图像直接渲染到窗口对应的渲染缓冲区

• 如果每个窗口只有一个缓冲区，在绘制过程中刷新了屏幕，窗口可能显示不出完整的图像

  • 屏幕缓冲区：用于显示在屏幕上
  • 离屏缓冲区：没有显示的
  • 在一个缓冲区渲染完成后，将屏幕缓冲区和离屏缓冲区进行交换，实现图像在屏幕上的显示

• 为了防⽌交换缓冲区的时候屏幕上下区域的图像分属于两个不同的帧

  • 垂直同步信号->等待显示器刷新完成的信号,在显示器器两次刷新的间隔中进⾏交换

• 使用了双缓冲区和垂直同步技术之后，由于总是要等待缓冲区交换之后再进⾏下⼀帧的渲染，使得帧率无法完全达到硬件允许的最⾼⽔平。

  • 三级缓冲区技术：
    • 在等待垂直同步时，来回交替渲染两个离屏的缓冲区
    • 垂直同步发生时，屏幕缓冲区和最近渲染完成的离屏缓冲区交换