OpenGL入门

本文最后更新于：6 个月前

https://learnopengl-cn.github.io/

基本是跟着这个网站来的，感谢大佬们提供了这么好的资源

OpenGL 状态机

熟悉这种状态机的模式非常有帮助。

openGL中的各种对象通常通过 glGenXXX 来生成，对象用一个uint来标识，openGL内部会记录这个uint对应的对象内容，我们只需把这个数看做一个对象即可。

绑定，openGL中常需要进行 glBindxxx 操作，这是将对象绑定到一个上下文，如 glBindBuffer(GL_ARRAY_BUFFER, VBO)，可以认为 GL_ARRAY_BUFFER 是一个上下文，有时也称 Target，绑定后，接下来对 GL_ARRAY_BUFFER 的操作就是对 VBO 的操作。

VBO，VAO

首先关注他们的名字：

  • 顶点缓冲对象：Vertex Buffer Object，VBO
  • 顶点数组对象：Vertex Array Object，VAO

每个顶点可能会包含一堆数据（常见的有坐标，颜色等），CPU需要把这些数据发送给显卡，为了一次性发送大量数据，会使用一个缓冲来暂存顶点数据，这就是VBO，它仅仅只是一堆本质上没区别的数据，具体如何访问这些数据，就是VAO决定的。

可以认为，VAO对VBO的数据定义了一种分类，组装的方式，将一堆数据拼成了有意义的一个数组，VAO就是把这种访问方式保存下来。

具体而言，我们可以创建一个VBO来保存东西：

unsigned int VBO;
//glGenXXX就是创建一个对象，为其分配空间
glGenBuffers(1, &VBO);
//将VBO绑定上缓冲GL_ARRAY_BUFFER，可以理解为设置状态：当前存储顶点的位置是VBO
glBindBuffer(GL_ARRAY_BUFFER, VBO);
//往一个缓冲中塞数据，这时的VBO已经绑定GL_ARRAY_BUFFER，这样就能保存在这个VBO当中
glBufferData(GL_ARRAY_BUFFER, sizeof(dataSource), dataSource, GL_STATIC_DRAW);

这样就有一块纯纯的数据了，可以用下面两行东西来指定这块东西的解读方式：

//设置对数据的解读方式
//首先，每个顶点属性有一个属性值（标号）（即vertexShader中的layout）
//这里的意思是：对于属性值为0的属性，它要读取3个float，不需要标准化，下一个顶点的对应属性在3个步长之后，从0开始读。
//然后设置：将属性值为0的顶点属性启用（默认是禁用的）
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
glEnableVertexAttribArray(0);

然后就能一行完成渲染啦！第一个参数为图元装配方式，指定为三角形，也就是说会把我们输入的顶点，每三个组成一个三角形传入片元着色器。从0位置开始，一共读3个顶点

glDrawArrays(GL_TRIANGLES, 0, 3);

因为openGL是一个大状态机，在渲染不同物体时，必须绑定对应的VBO，更改对应的解读方式才行。这样换起来太麻烦了，于是有了VAO：它能把这些都保存起来，然后直接绑定VAO就能自动绑定上VBO和切换glVertexAttribPointer。为什么它叫顶点数组对象呢？我理解为，它获取到一块数据和对应的解读方式，就直接将顶点分类包装成数组了。它具体存储的是什么，目前理解比较浅。

unsigned int VAO;
glGenVertexArrays(1, &VAO);
glBindVertexArray(VAO);
...
glBindVertexArray(0);

VAO是工作在bind和unbind之间的，也就是说，在glVertexAttribPointer之前，先将VAO绑定，然后VAO将记录你执行的glVertexAttribPointer，保存这一解读方式（同时也保存了当前绑定的VBO），记录完成后解绑VAO即可。渲染时如果要调用这组数据，直接绑定这个VAO就可以了，将自动设置glVertexAttrib Pointer和VBO，非常方便。

更多顶点属性

如果顶点包含两个属性：位置和颜色，在顶点着色器中分别将属性值设置为0和1

属性值只是一种标号，和内存地址无关

#version 330 core
layout (location = 0) in vec3 aPos;   // 位置变量的属性位置值为 0 
layout (location = 1) in vec3 aColor; // 颜色变量的属性位置值为 1

然后是VBO中的数据，里面有三个顶点：

float vertices[] = {
    // 位置              // 颜色
     0.5f, -0.5f, 0.0f,  1.0f, 0.0f, 0.0f,   // 右下
    -0.5f, -0.5f, 0.0f,  0.0f, 1.0f, 0.0f,   // 左下
     0.0f,  0.5f, 0.0f,  0.0f, 0.0f, 1.0f    // 顶部
};

对于这样的情况，解读方式应该是：

//位置属性
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);
glEnableVertexAttribArray(0);
//颜色属性
glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3* sizeof(float)));
glEnableVertexAttribArray(1);

注意：属性长度仍然是3，两个属性都只需要读3float的数据，步长是6，因为一个位置属性和下一个位置属性间隔6float，颜色属性的偏移为3，即起始点从3开始，6格6格跳

EBO 索引缓冲

实际绘制物体时，可以用一个个小三角拼成，比如要拼一个正方形，顶点数组可以这样：

float dataSource2[] = {
        0.9f, 0.9f, 0.0f,
        0.9f, 0.5f, 0.0f,
        0.5f, 0.5f, 0.0f,

        0.5f, 0.5f, 0.0f,
        0.5f, 0.9f, 0.0f,
        0.9f, 0.9f, 0.0f
};

图元装配时指定装配6个顶点，可以轻松得到一个正方形，它是两个三角形拼起来的

glDrawArrays(GL_TRIANGLES, 0, 6);

但是这样显然有大量冗余，所谓索引缓冲对象，就是指定了遍历顶点的方式，默认是从0..n这样遍历的，

我们可以指定遍历顺序。

unsigned int indices[] = { // 注意索引从0开始!
        0, 1, 2, // 第一个三角形
        2, 3, 0  // 第二个三角形
};
unsigned int EBO;
glGenBuffers(1, &EBO);
glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);

这里用和VBO相似的方式，配置了一个EBO，同样地，这个信息可以被VAO存储，只需要写在VAO的bind和unbind之间即可。

glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);

把绘图函数改成这个，即可按照当前绑定在GL_ELEMENT_ARRAY_BUFFER上的索引表来遍历。

着色器

主要编写的是顶点着色器和片段着色器

顶点着色器必须给出一个gl_Position，它表示这个顶点所在的位置（在标准化设备坐标下的，实际参与渲染的位置，不是什么局部坐标世界坐标之类的）

顶点着色器的其他各种输出信息在光栅化阶段会被各种“插值”，变成大量片元输出到片元着色器。比如经典的：用三个顶点坐标显示一个宏观的三角形，实际上片元着色器接受到的片段有成百上千个，但我们仅输入了三个顶点，每一个片段的具体位置均是根据插值得到的。

同时，各种其他顶点输出的信息也都会被插值，比如颜色等等。

片段着色器负责计算一个像素的最终颜色，它可能需要从顶点着色器中接收一些

uniform

着色器中可以使用uniform定义一个唯一的变量，在外部通过一些操作更改（实现外部直接把值传入shader任意一个阶段）

uniform float offX = 0, offY = 0;

外部，传入名称和值即可，glUniform后+数字+类型，如3f表示更改的是一个3维float向量类型

glUniform1i(glGetUniformLocation(shaderProgram, name), value);

外部获取这个值？没有找到资料，可能从外部获取它的值本就不合逻辑

uniform不能在shader内部赋值，但可以初始化（设置缺省值）

特殊的uniform
uniform sampler2D texture1;

用于获取纹理，它的值可以用int方式更改，如果它为2，那么它就表示GL_TEXTURE2这个纹理单元上的纹理图片，在shader中使用 texture(texture1, Texpos) 获得这张纹理具体位置上的颜色。

sampler2D 是一种“不透明类型”，它不能被实例化，只能定义为uniform。

包含有不透明类型的结构体、类同样为不透明类型。

注意：虽然 glUseProgram 指明了shaderprogram，但仍必须use着色器之后才能对其设置！

纹理

Texture unit（GL_TEXTUREi） 包含了多种 Target，但规范明确表示了，每个sampler必须使用不同的unit，即便它们的类型不同。

完整管线

顶点进入顶点着色器，经历局部坐标 - 世界坐标 - 观察坐标，变换到观察空间

随后通过一个投影矩阵，这个投影矩阵定义了空间中一块能看见的区域（长方体、平头截体），投影矩阵将这片区域映射到 $[-1,1]^3$ 这个小立方体中，我们最终只绘制这个小立方体内的物体。

这个小立方体就是裁剪空间，也叫标准设备坐标系，NDC。后续操作在这个坐标系中进行。

我们在上面的变换中一直认为 $(a,b,c,1)$ 和 $(aw,bw,cw,w)$ 是同一个坐标，转换到NDC之后该归一化一下了，这一步也叫透视除法，就是让每个顶点的 $x,y,z$ 都除以它的 $w$ 分量，$w$ 分量本身保持不变，是为了保留其深度信息以做矫正。

然后进行一个简单的视口变换，在 $xy$ 方向拉伸平移一下，不去动 $z$。

在此之前我们一直对顶点操作，接下来进行图元装配，经过几何着色器我们得到了三角形（或者其他形状）

对三角形进行光栅化，随后每个像素（片段）进入片段着色器，用插值后的数据来计算这个像素的最终颜色并输出。

随后进行深度测试，丢弃一些片段，通常也可以在着色一个像素前就测试并丢弃。

上述视口变换和图元装配，顺序应该无所谓。

理清变换

理清的关键点：

  • 使用四阶矩阵，不仅能表达一种变换，也能表达一种坐标系。左上三维为三个基向量，右列三个数为原点位置，右下角为 $w$ 分量

    • 可以视为先进行了左上3x3矩阵所示的线性变换，再进行了一个平移

  • 对于每个物体，用一个Transform矩阵表达其坐标系，它也相当于物体从和世界坐标系重合（单位矩阵）开始，到当前状态经历的变换。对物体的变换都是对整个坐标系的变换

    • 这个变换看起来不是线性变换（移动了原点），但在四维空间下，它是线性变换。
    • 如果想让物体参照世界坐标系变换，就直接在其矩阵左侧乘即可。
    • 如果想让物体参考自身坐标系变换，可以运用相似矩阵（相当于矩阵右侧乘）

  • 对于单个顶点，才用向量表示，它在物体坐标系下是一个固定的量。

  • 相机可以认为是一个物体，它有一个坐标系，它的朝向是一个向量，相对于相机坐标系也固定的，在openGL中应为 $(0,0,-1)$（朝 $z$ 轴负方向）

    • 因此也可以用一个简单的矩阵来描述相机，不必关心其朝向，因为我们直接记录了相机坐标系，朝向固定为 $(0,0-1)$

光照

当我们把一个光照施加到一个物体上时，输出光照颜色和物体颜色的乘积（各个分量各自相乘）即可，注意这里的颜色量值域为(0, 1)，而非(0, 255)

冯氏光照模型主要分三部分：环境光照，漫反射，镜面反射

环境光照：始终使物体接受到某个光照，例如(0.1, 0.1, 0.1)

漫反射：对于每个片元，取其法向量和光照方向的点积（二者都标准化到模为1）作为光照强度，即正对光照的亮度高，背对的亮度低。（这个阶段我们一般不考虑阻挡、距离等因素）

镜面反射：对每个片元，取其光照反射方向（通过法向量计算）和玩家视觉方向的点积，作为光照强度，意义是玩家在某个片元反射方向附近时，能看到它上面的高光。

点积的两个向量都为标准化向量，故结果不大于1，为了更加凸显高光可以对这个值取幂，一般取32次幂为宜，越大则说明高光越集中，反射能力越强。

注意镜面反射仅与观察者位置有关，与观察者视角无关

法线

直观上来讲，一个三角形的法线可以直接由三条边计算出来，但openGL并不会直接帮我们算这个，是有原因的。

法线信息一般放在顶点上，若模型没给定，可以由面法线均值计算得到。

片元法线如果由插值得到，可以获得平滑的光照效果，而如果三个顶点法线都一样，则可以有锐利边缘。

法线变换

物体变换时法线也应该跟着变，法线和一般的顶点位置向量不同，在不等比缩放时，它应当保持垂直关系而非进行相同变换；它也不应受位移影响。

简单数理推导可得出，法线变换矩阵应当是变换矩阵左上3x3矩阵的逆矩阵的转置

逆矩阵运算对于GPU来说非常慢，故最好在CPU中计算好直接传入。

材质和光照贴图

材质即物体的贴图+上述光照模型中的参数，通过更改三种光的强度以及反光度可以模拟不同物体的反射效果。

并不是每一个参数都值得更改，一般的材质：

struct Material{
    sampler2D diffuse;
    vec3 specular;
    float spininess;
};
  • 环境光颜色与漫反射颜色 = 物体自身颜色，通常没必要更改，强度差别取决于光照设定
  • 镜面光颜色 = 白 * 一定系数，这个系数决定了镜面光的亮度。
    • 也可以用物体自身颜色，这会使高光更接近物体自身颜色，使用白色则高光更接近光源颜色。
  • 反光度/镜面反射率决定了表面反光能力，越大则反光越强，高光越集中，越适用于金属玻璃等材质。

材质参考：http://devernay.free.fr/cours/opengl/materials.html

光照材质：

struct Light{
    vec3 position;
    vec3 ambient;
    vec3 diffuse;
    vec3 specular;
};

环境光、漫反射、镜面反射的配比取决于我们对光照的设定。通常镜面颜色设置为光源本身颜色，漫反射和环境光设置为光源颜色的0.6, 0.2倍左右。

光照贴图

可以给物体附上多张贴图，在漫反射部分使用漫反射贴图，镜面反射部分使用高光反射贴图，实现同一个物体表面不同部分的不同效果。

网格与模型

网格这个名词一开始让我有点搞不明白，后来我意识到一件事情：3d模型是十分复杂的，除了基本的顶点数据之外，还可能包含多张贴图、动画、多种材质乃至场景信息，不同部分可能应用不同贴图。

“网格”就是一组三角面片，包含一个顶点数组和相应贴图，即先前我们理解中最简单的模型，一个实际的模型包含许多网格。

模型除了用网格表示外，还有点云、体素等多种方式。本项目只考虑网格。

模型文件格式众多，可以使用工具库assimp读取，需要了解的是大多数模型存储的逻辑：使用一个模型文件记录网格信息，在旁边放贴图等资源文件，模型文件中包含了贴图相对路径等信息。故通常不能将下载到的模型和资源文件拆开。

缓冲与测试

openGL提供了若干种缓冲（临时数组），我们通常在每一帧绘制前使用 glClear 清空这些缓冲。

深度测试和模板测试可以根据缓冲内容选择性地抛弃一些片元，可以用 glEnable 启用测试，也有各自的函数来配置筛选方法、写入掩码等等。

深度缓冲和模板缓冲都以屏幕位置为索引，它们在每一次绘制前被清空，绘制内容时被更新，从而影响接下来的绘制。简而言之它们是面向整个场景而非单个物体的。

深度测试

记录屏幕坐标下每个位置上的片元深度（$z$ 坐标），一般情况下，仅当新片元深度更小时才会绘制并更新。可以用 glglDepthFunc 配置其他的筛选方式。

关于深度：强大的裁剪矩阵已经帮我们计算好了每个片元的 $x,y$ 位置以及深度，深度测试其实就是记录每个位置的最大深度以及颜色。它使用的缓冲我们需要手动清空 glClear(GL_DEPTH_BUFFER_BIT);，记得 glClear 是用bitmask的，可以把 GL_DEPTH_BUFFER_BIT 和其他东西或起来。

裁剪矩阵对 $z$ 轴的映射也不是线性的，越远的地方粒度越大，精度越低。

具体而言，映射后的深度值（也叫深度精度值？）是与 $1/z$ 正相关的，如近平面距离为2，远平面距离为10，则深度值0.5实际对应了 $\frac{1}{1/2+1/10}$ 即距离2.5的地方。

片段着色器中，gl_FragCoord这个内建变量存储了该片段的深度信息，$x,y,z$ 分别表示片段的位置和深度。

深度冲突

如果两个平面恰好重叠在一起，就很难说明谁上谁下了，常常会导致闪烁，实际渲染中应当尽量避免此类情况。

模板测试

面剔除

一种非常聪明的技巧。

试想：在我们观察一个封闭几何体的时候，总有几个面是永远看不到的（是指背面，而非里面），对于这几个面，虽然用深度缓冲能覆盖他们，但还不够优秀，我们有办法把它更早一步剔除掉。

如果我们在定义一个面的顶点顺序时，始终假设我们面向它（从封闭几何体的外部），然后逆时针写下这三个顶点。

那么在三角形变换到裁剪空间下后，如果它还是面向我们，三个顶点就一定是逆时针的，否则就一定是顺时针，可以直接将其剔除。

判断顺逆时针是个运算量很小的活，所以面剔除能非常有效地提升性能。

面剔除的结果：在封闭几何体的内部观察时，它透明了。如果我们对一个单独的三角形进行面剔除，会发现只能从一个方向上看到它，这些特性有时也会被利用到。

它可能很像是剔除了一个面的里面，但我们都知道图形学本身没有什么内外双面的概念，只是剔除了背面而已。

透明与混合

将半透明的物体绘制到原有颜色缓冲上，需要进行混合。

通常将颜色缓冲中原有的内容叫目标，即将绘制的半透明颜色叫源，将源绘制到目标上。

问题：深度测试，处于前方的透明物体先绘制之后，后面的内容将不会绘制。

解决：透明物体最后绘制，且按到视点的距离排序，由远到近绘制。

问题：距离不好排序，通常采取近似方法，适用于大部分场合。

笔记
#图形学 #openGL
OpenGL入门
http://www.lxtyin.ac.cn/2023/02/26/openGL入门/
作者
lx_tyin
发布于
2023年2月26日
许可协议