经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置：技术经验 » 软件/图像 » OpenGL » 查看文章
OpenGL光照2：材质和光照贴图
来源：cnblogs　　作者：zhxmdefj　　时间：2019/8/19 8:42:23　　对本文有异议

本文是个人学习记录，学习建议看教程 https://learnopengl-cn.github.io/
非常感谢原作者JoeyDeVries和多为中文翻译者提供的优质教程

的内容为插入注释，可以先跳过

材质

在现实世界里，每个物体会对光产生不同的反应，钢看起来通常会比陶瓷花瓶更闪闪发光，木头箱子也不会像钢制箱子那样对光产生很强的反射

每个物体对镜面高光也有不同的反应，有些物体反射光的时候不会有太多的散射(Scatter)，因而产生一个较小的高光点，而有些物体则会散射很多，产生一个有着更大半径的高光点，如果我们想要在OpenGL中模拟多种类型的物体，我们必须为每个物体分别定义一个材质(Material)属性

之前我们指定了一个物体和光的颜色，以及结合环境光和镜面强度分量，来定义物体的视觉输出，当描述一个物体的时候，我们可以用这三个分量来定义一个材质颜色(Material Color)：环境光照(Ambient Lighting)、漫反射光照(Diffuse Lighting)和镜面光照(Specular Lighting)。通过为每个分量指定一个颜色，我们就能够对物体的颜色输出有着精细的控制了

现在，我们再添加反光度(Shininess)这个分量到上述的三个颜色中，这就有我们需要的所有材质属性了

  1. //片段着色器
  2. #version 330 core
  4. struct Material {
  5.     vec3 ambient;
  6.     vec3 diffuse;
  7.     vec3 specular;
  8.     float shininess;
  9. }; 
  11. uniform Material material;
  13. //......

在片段着色器中，我们创建一个结构体(Struct)来储存物体的材质属性，并简单地声明一个uniform变量

你可以看到，我们为每个冯氏光照模型的分量都定义一个颜色向量，ambient材质向量定义了在环境光照下这个物体反射得是什么颜色，通常这是和物体颜色相同的颜色。diffuse材质向量定义了在漫反射光照下物体的颜色。（和环境光照一样）漫反射颜色也要设置为我们需要的物体颜色。specular材质向量设置的是镜面光照对物体的颜色影响（或者甚至可能反射一个物体特定的镜面高光颜色）。最后，shininess影响镜面高光的散射/半径。

这四个元素定义了一个物体的材质，通过它们我们能够模拟很多现实世界中的材质，devernay.free.fr上的一个表格展示了几种材质属性，它们模拟了现实世界中的真实材质

可以看到，通过正确地指定一个物体的材质属性，我们对这个物体的感知也就不同了，效果非常明显，当然要想获得更真实的效果，我们最终需要更加复杂的形状，而不单单是一个立方体

为一个物体赋予一款合适的材质是非常困难的，这需要大量实验和丰富的经验，所以由于不合适的材质而毁了物体的视觉质量是件经常发生的事

我们现在就开始在着色器中实现这样的一个材质系统

设置材质

我们在片段着色器中创建了一个材质结构体的uniform，所以下面我们希望修改一下光照的计算来顺应新的材质属性，由于所有材质变量都储存在结构体中，我们可以从uniform变量material中访问它们：

  1. //片段着色器
  3. void main()
  4. {    
  5.     // 环境光
  6.     vec3 ambient = lightColor * material.ambient;
  8.     // 漫反射 
  9.     vec3 norm = normalize(Normal);
  10.     vec3 lightDir = normalize(lightPos - FragPos);
  11.     float diff = max(dot(norm, lightDir), 0.0);
  12.     vec3 diffuse = lightColor * (diff * material.diffuse);
  14.     // 镜面光
  15.     vec3 viewDir = normalize(viewPos - FragPos);
  16.     vec3 reflectDir = reflect(-lightDir, norm);  
  17.     float spec = pow(max(dot(viewDir, reflectDir), 0.0), material.shininess);
  18.     vec3 specular = lightColor * (spec * material.specular);  
  20.     vec3 result = ambient + diffuse + specular;
  21.     FragColor = vec4(result, 1.0);
  22. }

可以看到，我们现在在需要的地方访问了材质结构体中的所有属性，并且这次是根据材质的颜色来计算最终的输出颜色的，物体的每个材质属性都乘上了它们对应的光照分量

我们现在可以在程序中设置适当的uniform，对物体设置材质了，GLSL中的结构体在设置uniform时并没有什么特别之处，结构体只是作为uniform变量的一个封装，所以如果想填充这个结构体的话，我们仍需要对每个单独的uniform进行设置，但这次要带上结构体名的前缀：

  1. lightingShader.setVec3("material.ambient",  1.0f, 0.5f, 0.31f);
  2. lightingShader.setVec3("material.diffuse",  1.0f, 0.5f, 0.31f);
  3. lightingShader.setVec3("material.specular", 0.5f, 0.5f, 0.5f);
  4. lightingShader.setFloat("material.shininess", 32.0f);

我们将环境光和漫反射分量设置成我们想要让物体所拥有的颜色，而将镜面分量设置为一个中等亮度的颜色，我们不希望镜面分量在这个物体上过于强烈，我们将反光度保持为32，现在我们能够程序中非常容易地修改物体的材质了

但是又有一个问题，这个物体太亮了

光的属性

物体过亮的原因是环境光、漫反射和镜面光这三个颜色对任何一个光源都会去全力反射，光源对环境光、漫反射和镜面光分量也具有着不同的强度，之前我们通过使用一个强度值改变环境光和镜面光强度的方式解决了这个问题，我们想做一个类似的系统，但是这次是要为每个光照分量都指定一个强度向量

如果我们假设lightColor是vec3(1.0)，代码会看起来像这样：

  1. vec3 ambient  = vec3(1.0) * material.ambient;
  2. vec3 diffuse  = vec3(1.0) * (diff * material.diffuse);
  3. vec3 specular = vec3(1.0) * (spec * material.specular);

所以物体的每个材质属性对每一个光照分量都返回了最大的强度，对单个光源来说，这些vec3(1.0)值同样可以分别改变，而这通常就是我们想要的

现在，物体的环境光分量完全地影响了立方体的颜色，可是环境光分量实际上不应该对最终的颜色有这么大的影响，所以我们会将光源的环境光强度设置为一个小一点的值，从而限制环境光颜色：

  1. vec3 ambient = vec3(0.1) * material.ambient;

我们可以用同样的方式修改光源的漫反射和镜面光强度，这和我们之前做的极为相似，你可以说我们已经创建了一些光照属性来影响每个单独的光照分量，我们希望为光照属性创建一个与材质结构体类似的结构体：

  1. struct Light {
  2.     vec3 position;
  4.     vec3 ambient;
  5.     vec3 diffuse;
  6.     vec3 specular;
  7. };
  9. uniform Light light;

一个光源对它的ambient、diffuse和specular光照有着不同的强度。环境光照通常会设置为一个比较低的强度，因为我们不希望环境光颜色太过显眼。光源的漫反射分量通常设置为光所具有的颜色，通常是一个比较明亮的白色。镜面光分量通常会保持为vec3(1.0)，以最大强度发光。注意我们也将光源的位置添加到了结构体中。

和材质uniform一样，我们需要更新片段着色器：

  1. vec3 ambient  = light.ambient * material.ambient;
  2. vec3 diffuse  = light.diffuse * (diff * material.diffuse);
  3. vec3 specular = light.specular * (spec * material.specular);

我们接下来在程序中设置光照强度：

  1. lightingShader.setVec3("light.ambient",  0.2f, 0.2f, 0.2f);
  2. lightingShader.setVec3("light.diffuse",  0.5f, 0.5f, 0.5f); // 将光照调暗了一些以搭配场景
  3. lightingShader.setVec3("light.specular", 1.0f, 1.0f, 1.0f);

现在我们调整了光照对物体材质的影响，我们应该能得到一个更类似于上一节的视觉效果。但这次我们有了对光照和物体材质的完全掌控：

不同的光源颜色

到目前为止，我们都只对光源设置了从白到灰到黑范围内的颜色，这样只会改变物体各个分量的强度，而不是它的真正颜色，由于现在能够非常容易地访问光照的属性了，我们可以随着时间改变它们的颜色，从而获得一些非常有意思的效果

由于所有的东西都在片段着色器中配置好了，修改光源的颜色非常简单

我们可以利用sin和glfwGetTime函数改变光源的环境光和漫反射颜色，从而很容易地让光源的颜色随着时间变化：

  1. glm::vec3 lightColor;
  2. lightColor.x = sin(glfwGetTime() * 2.0f);
  3. lightColor.y = sin(glfwGetTime() * 0.7f);
  4. lightColor.z = sin(glfwGetTime() * 1.3f);
  6. glm::vec3 diffuseColor = lightColor   * glm::vec3(0.5f); // 降低影响
  7. glm::vec3 ambientColor = diffuseColor * glm::vec3(0.2f); // 很低的影响
  9. lightingShader.setVec3("light.ambient", ambientColor);
  10. lightingShader.setVec3("light.diffuse", diffuseColor);

6qfw3W6PA4

光照贴图

现在让每个物体都拥有自己独特的材质从而对光照做出不同的反应的方法，这样子能够很容易在一个光照的场景中给每个物体一个独特的外观，但是这仍不能对一个物体的视觉输出提供足够多的灵活性

我们将整个物体的材质定义为一个整体，但现实世界中的物体通常并不只包含有一种材质，而是由多种材质所组成，也就是说物体在不同的部件上都有不同的材质属性

所以，我们目前的材质系统是肯定不够的，它只是一个最简单的模型，所以我们需要拓展之前的系统，引入漫反射和镜面光贴图(Map)，这允许我们对物体的漫反射分量（以及间接地对环境光分量，它们几乎总是一样的）和镜面光分量有着更精确的控制

漫反射贴图

我们希望通过某种方式对物体的每个片段单独设置漫反射颜色，有能够让我们根据片段在物体上的位置来获取颜色值得系统吗？

这可能听起来很熟悉，而且事实上这个系统我们已经使用很长时间了，这听起来很像在之前详细讨论过的纹理，其实的确就是如此，我们仅仅是对同样的原理使用了不同的名字：纹理和贴图其实都是使用一张覆盖物体的图像，让我们能够逐片段索引其独立的颜色值，在光照场景中，它通常叫做一个漫反射贴图(Diffuse Map)，它是一个表现了物体所有的漫反射颜色的纹理图像

为了演示漫反射贴图，我们将会使用这张图片，它是一个有钢边框的木箱：

请把这张图片导入到你的工程目录，我们之后会用到它

在着色器中使用漫反射贴图的方法和纹理教程中是完全一样的，但这次我们会将纹理储存为Material结构体中的一个sampler2D，我们将之前定义的vec3漫反射颜色向量替换为漫反射贴图

注意sampler2D是所谓的不透明类型(Opaque Type)，也就是说我们不能将它实例化，只能通过uniform来定义它，如果我们使用除uniform以外的方法（比如函数的参数）实例化这个结构体，GLSL会抛出一些奇怪的错误，同样适用于任何封装了不透明类型的结构体

我们也移除了环境光材质颜色向量，因为环境光颜色在几乎所有情况下都等于漫反射颜色，所以我们不需要将它们分开储存：

  1. struct Material { 
  2.     sampler2D diffuse; 
  3.     vec3      specular; 
  4.     float     shininess; 
  5. }; 
  6. ... 
  7. in vec2 TexCoords;

如果你非常固执，仍想将环境光颜色设置为一个（漫反射值之外）不同的值，你也可以保留这个环境光的vec3，但整个物体仍只能拥有一个环境光颜色
如果想要对不同片段有不同的环境光值，你需要对环境光值单独使用另外一个纹理

注意我们将在片段着色器中再次需要纹理坐标，所以我们声明一个额外的输入变量。接下来我们只需要从纹理中采样片段的漫反射颜色值即可：

  1. vec3 diffuse = light.diffuse * diff * vec3(texture(material.diffuse, TexCoords));

不要忘记将环境光得材质颜色设置为漫反射材质颜色同样的值。

  1. vec3 ambient = light.ambient * vec3(texture(material.diffuse, TexCoords));

这就是使用漫反射贴图的全部步骤了，这也不是什么新的东西，但这能够极大地提高视觉品质，为了让它正常工作，我们还需要使用纹理坐标更新顶点数据，将它们作为顶点属性传递到片段着色器，加载材质并绑定材质到合适的纹理单元

更新后的顶点数据为：

  1. float vertices[] = {
  2.     // positions          // normals           // texture coords
  3.     -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  4.      0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 0.0f,
  5.      0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  6.      0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  7.     -0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 1.0f,
  8.     -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  10.     -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  11.      0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 0.0f,
  12.      0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  13.      0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  14.     -0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 1.0f,
  15.     -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  17.     -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  18.     -0.5f,  0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  19.     -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  20.     -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  21.     -0.5f, -0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  22.     -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  24.      0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  25.      0.5f,  0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  26.      0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  27.      0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  28.      0.5f, -0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  29.      0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  31.     -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  32.      0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 1.0f,
  33.      0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  34.      0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  35.     -0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 0.0f,
  36.     -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  38.     -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f,
  39.      0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 1.0f,
  40.      0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  41.      0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  42.     -0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 0.0f,
  43.     -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f
  44. };

顶点数据现在包含了顶点位置、法向量和立方体顶点处的纹理坐标

现在我们要更新顶点着色器来以顶点属性的形式接受纹理坐标，并将它们传递到片段着色器中：

  1. #version 330 core
  2. layout (location = 0) in vec3 aPos;
  3. layout (location = 1) in vec3 aNormal;
  4. layout (location = 2) in vec2 aTexCoords;
  5. ...
  6. out vec2 TexCoords;
  8. void main()
  9. {
  10.     ...
  11.     TexCoords = aTexCoords;
  12. }

记得去更新两个VAO的顶点属性指针来匹配新的顶点数据

  1. glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);
  2. glEnableVertexAttribArray(0);
  3. glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));
  4. glEnableVertexAttribArray(1);
  5. glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));
  6. glEnableVertexAttribArray(2);

并加载箱子图像为一个纹理，加载的方法如果你忘了，可以回头看看这篇博客

  1. //use function
  2. unsigned int diffuseMap = loadTexture("container2.png");
  4. //function
  5. unsigned int loadTexture(char const * path)
  6. {
  7.     unsigned int textureID;
  8.     glGenTextures(1, &textureID);
  10.     int width, height, nrComponents;
  11.     unsigned char *data = stbi_load(path, &width, &height, &nrComponents, 0);
  12.     if (data)
  13.     {
  14.         GLenum format;
  15.         if (nrComponents == 1)
  16.             format = GL_RED;
  17.         else if (nrComponents == 3)
  18.             format = GL_RGB;
  19.         else if (nrComponents == 4)
  20.             format = GL_RGBA;
  22.         glBindTexture(GL_TEXTURE_2D, textureID);
  23.         glTexImage2D(GL_TEXTURE_2D, 0, format, width, height, 0, format, GL_UNSIGNED_BYTE, data);
  24.         glGenerateMipmap(GL_TEXTURE_2D);
  26.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
  27.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
  28.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR);
  29.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
  31.         stbi_image_free(data);
  32.     }
  33.     else
  34.     {
  35.         std::cout << "Texture failed to load at path: " << path << std::endl;
  36.         stbi_image_free(data);
  37.     }
  39.     return textureID;
  40. }

在绘制箱子之前，我们希望将要用的纹理单元赋值到material.diffuse这个uniform采样器

  1. lightingShader.setInt("material.diffuse", 0);

并绑定箱子的纹理到这个纹理单元：

  1. glActiveTexture(GL_TEXTURE0);
  2. glBindTexture(GL_TEXTURE_2D, diffuseMap);

然后就可以运行了

可以看到使用了漫反射贴图之后，细节再一次得到惊人的提升

awesome~man

参考源码：

  1. #include <glad/glad.h>
  2. #include <GLFW/glfw3.h>
  4. #include <iostream> 
  6. #include "shader_s.h"
  7. #include "camera.h"
  9. #define STB_IMAGE_IMPLEMENTATION
  10. #include "stb_image.h"
  12. #include <glm/glm.hpp>
  13. #include <glm/gtc/matrix_transform.hpp>
  14. #include <glm/gtc/type_ptr.hpp>
  16. void framebuffer_size_callback(GLFWwindow* window, int width, int height);
  17. void mouse_callback(GLFWwindow* window, double xpos, double ypos);
  18. void scroll_callback(GLFWwindow* window, double xoffset, double yoffset);
  19. void processInput(GLFWwindow *window);
  20. unsigned int loadTexture(char const * path);
  22. // settings
  23. const unsigned int SCR_WIDTH = 800;
  24. const unsigned int SCR_HEIGHT = 600;
  26. // camera
  27. Camera camera(glm::vec3(0.0f, 0.0f, 3.0f));
  28. float lastX = SCR_WIDTH / 2.0f;
  29. float lastY = SCR_HEIGHT / 2.0f;
  30. bool firstMouse = true;
  32. float deltaTime = 0.0f; // 当前帧与上一帧的时间差
  33. float lastFrame = 0.0f; // 上一帧的时间
  35. glm::vec3 lightPos(1.2f, 1.0f, 2.0f);
  37. int main()
  38. {
  39.     // glfw初始化
  40.     glfwInit();
  41.     glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
  42.     glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
  43.     glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
  45.     // glfw创建窗口
  46.     GLFWwindow* window = glfwCreateWindow(SCR_WIDTH, SCR_HEIGHT, "LearnOpenGL", NULL, NULL);
  47.     if (window == NULL)
  48.     {
  49.         std::cout << "Failed to create GLFW window" << std::endl;
  50.         glfwTerminate();
  51.         return -1;
  52.     }
  53.     glfwMakeContextCurrent(window);
  54.     glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);
  55.     glfwSetCursorPosCallback(window, mouse_callback);
  56.     glfwSetScrollCallback(window, scroll_callback);
  58.     // 捕捉鼠标
  59.     glfwSetInputMode(window, GLFW_CURSOR, GLFW_CURSOR_DISABLED);
  61.     // glad加载所有OpenGL函数指针
  62.     if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
  63.     {
  64.         std::cout << "Failed to initialize GLAD" << std::endl;
  65.         return -1;
  66.     }
  68.     glEnable(GL_DEPTH_TEST);
  70.     Shader lightingShader("colorVertex.txt", "colorFragment.txt");// 起什么名字自己定
  71.     Shader lampShader("lampVertex.txt", "lampFragment.txt");
  73.     float vertices[] = {
  74.         // positions          // normals           // texture coords
  75.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  76.          0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 0.0f,
  77.          0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  78.          0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  79.         -0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 1.0f,
  80.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  82.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  83.          0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 0.0f,
  84.          0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  85.          0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  86.         -0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 1.0f,
  87.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  89.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  90.         -0.5f,  0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  91.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  92.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  93.         -0.5f, -0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  94.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  96.          0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  97.          0.5f,  0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  98.          0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  99.          0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  100.          0.5f, -0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  101.          0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  103.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  104.          0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 1.0f,
  105.          0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  106.          0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  107.         -0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 0.0f,
  108.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  110.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f,
  111.          0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 1.0f,
  112.          0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  113.          0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  114.         -0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 0.0f,
  115.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f
  116.     };
  118.     unsigned int VBO;
  119.     glGenBuffers(1, &VBO);
  121.     unsigned int cubeVAO;
  122.     glGenVertexArrays(1, &cubeVAO);
  123.     glBindVertexArray(cubeVAO);
  125.     glBindBuffer(GL_ARRAY_BUFFER, VBO);
  126.     glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);
  127.     glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);
  128.     glEnableVertexAttribArray(0);
  129.     glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));
  130.     glEnableVertexAttribArray(1);
  131.     glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));
  132.     glEnableVertexAttribArray(2);
  135.     unsigned int lightVAO;
  136.     glGenVertexArrays(1, &lightVAO);
  137.     glBindVertexArray(lightVAO);
  139.     glBindBuffer(GL_ARRAY_BUFFER, VBO);
  141.     glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);
  142.     glEnableVertexAttribArray(0);
  144.     unsigned int diffuseMap = loadTexture("container2.png");
  146.     lightingShader.use();
  147.     lightingShader.setInt("material.diffuse", 0);
  150.     // 渲染循环
  151.     while (!glfwWindowShouldClose(window))
  152.     {
  153.         // 帧时间差
  154.         float currentFrame = glfwGetTime();
  155.         deltaTime = currentFrame - lastFrame;
  156.         lastFrame = currentFrame;
  158.         // 输入
  159.         processInput(window);
  161.         // 渲染指令
  162.         glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
  163.         glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
  165.         lightingShader.use();
  166.         lightingShader.setVec3("objectColor", 1.0f, 0.5f, 0.31f);
  167.         lightingShader.setVec3("lightColor", 1.0f, 1.0f, 1.0f);
  168.         lightingShader.setVec3("lightPos", lightPos);
  169.         lightingShader.setVec3("viewPos", camera.Position);
  171.         lightingShader.setVec3("material.ambient", 1.0f, 0.5f, 0.31f);
  172.         lightingShader.setVec3("material.diffuse", 1.0f, 0.5f, 0.31f);
  173.         lightingShader.setVec3("material.specular", 0.5f, 0.5f, 0.5f);
  174.         lightingShader.setFloat("material.shininess", 32.0f);
  176.         lightingShader.setVec3("light.ambient", 0.2f, 0.2f, 0.2f);
  177.         lightingShader.setVec3("light.diffuse", 0.7f, 0.7f, 0.7f); // 将光照调暗了一些以搭配场景
  178.         lightingShader.setVec3("light.specular", 1.0f, 1.0f, 1.0f);
  180.         // 初始化变换矩阵
  181.         glm::mat4 projection = glm::perspective(glm::radians(camera.Zoom), (float)SCR_WIDTH / (float)SCR_HEIGHT, 0.1f, 100.0f);
  182.         glm::mat4 view = camera.GetViewMatrix();
  183.         lightingShader.setMat4("projection", projection);
  184.         lightingShader.setMat4("view", view);
  186.         glm::mat4 model = glm::mat4();
  187.         lightingShader.setMat4("model", model);
  189.         glActiveTexture(GL_TEXTURE0);
  190.         glBindTexture(GL_TEXTURE_2D, diffuseMap);
  192.         glBindVertexArray(cubeVAO);
  193.         glDrawArrays(GL_TRIANGLES, 0, 36);
  195.         model = glm::translate(model, lightPos);
  196.         model = glm::scale(model, glm::vec3(0.2f));
  198.         lampShader.use();
  199.         // 设置模型、视图和投影矩阵uniform
  200.         lampShader.setMat4("projection", projection);
  201.         lampShader.setMat4("view", view);
  202.         model = glm::mat4(1.0f);
  203.         model = glm::translate(model, lightPos);
  204.         model = glm::scale(model, glm::vec3(0.2f)); // 小点的立方体
  205.         lampShader.setMat4("model", model);
  206.         // 绘制灯立方体对象
  207.         glBindVertexArray(lightVAO);
  208.         glDrawArrays(GL_TRIANGLES, 0, 36);
  211.         // 交换缓冲并查询IO事件
  212.         glfwSwapBuffers(window);
  213.         glfwPollEvents();
  214.     }
  215.     glDeleteVertexArrays(1, &cubeVAO);
  216.     glDeleteBuffers(1, &VBO);
  218.     glfwTerminate();
  219.     return 0;
  220. }
  222. void processInput(GLFWwindow *window)
  223. {
  224.     if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)//是否按下了返回键
  225.         glfwSetWindowShouldClose(window, true);
  227.     if (glfwGetKey(window, GLFW_KEY_W) == GLFW_PRESS)
  228.         camera.ProcessKeyboard(FORWARD, deltaTime);
  229.     if (glfwGetKey(window, GLFW_KEY_S) == GLFW_PRESS)
  230.         camera.ProcessKeyboard(BACKWARD, deltaTime);
  231.     if (glfwGetKey(window, GLFW_KEY_A) == GLFW_PRESS)
  232.         camera.ProcessKeyboard(LEFT, deltaTime);
  233.     if (glfwGetKey(window, GLFW_KEY_D) == GLFW_PRESS)
  234.         camera.ProcessKeyboard(RIGHT, deltaTime);
  235. }
  237. void framebuffer_size_callback(GLFWwindow* window, int width, int height)
  238. {
  239.     glViewport(0, 0, width, height);
  240. }
  242. void mouse_callback(GLFWwindow* window, double xpos, double ypos)
  243. {
  244.     if (firstMouse)
  245.     {
  246.         lastX = xpos;
  247.         lastY = ypos;
  248.         firstMouse = false;
  249.     }
  251.     float xoffset = xpos - lastX;
  252.     float yoffset = lastY - ypos; // reversed since y-coordinates go from bottom to top
  254.     lastX = xpos;
  255.     lastY = ypos;
  257.     camera.ProcessMouseMovement(xoffset, yoffset);
  258. }
  260. void scroll_callback(GLFWwindow* window, double xoffset, double yoffset)
  261. {
  262.     camera.ProcessMouseScroll(yoffset);
  263. }
  265. unsigned int loadTexture(char const * path)
  266. {
  267.     unsigned int textureID;
  268.     glGenTextures(1, &textureID);
  270.     int width, height, nrComponents;
  271.     unsigned char *data = stbi_load(path, &width, &height, &nrComponents, 0);
  272.     if (data)
  273.     {
  274.         GLenum format;
  275.         if (nrComponents == 1)
  276.             format = GL_RED;
  277.         else if (nrComponents == 3)
  278.             format = GL_RGB;
  279.         else if (nrComponents == 4)
  280.             format = GL_RGBA;
  282.         glBindTexture(GL_TEXTURE_2D, textureID);
  283.         glTexImage2D(GL_TEXTURE_2D, 0, format, width, height, 0, format, GL_UNSIGNED_BYTE, data);
  284.         glGenerateMipmap(GL_TEXTURE_2D);
  286.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
  287.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
  288.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR);
  289.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
  291.         stbi_image_free(data);
  292.     }
  293.     else
  294.     {
  295.         std::cout << "Texture failed to load at path: " << path << std::endl;
  296.         stbi_image_free(data);
  297.     }
  299.     return textureID;
  300. }

镜面光贴图

你可能会注意到，镜面高光看起来有些奇怪，因为我们的物体大部分都是木头，我们知道木头不应该有这么强的镜面高光的，我们可以将物体的镜面光材质设置为vec3(0.0)来解决这个问题，但这也意味着箱子钢制的边框将不再能够显示镜面高光了，钢铁应该是有一些镜面高光的

所以，我们想要让物体的某些部分以不同的强度显示镜面高光，这个问题看起来和漫反射贴图非常相似，是巧合吗？我想不是

我们同样可以使用一个专门用于镜面高光的纹理贴图，这也就意味着我们需要生成一个黑白的纹理（如果你想得话也可以是彩色的），来定义物体每部分的镜面光强度

镜面高光的强度可以通过图像每个像素的亮度来获取，镜面光贴图上的每个像素都可以由一个颜色向量来表示，比如说黑色代表颜色向量vec3(0.0)，灰色代表颜色向量vec3(0.5)，在片段着色器中，我们接下来会取样对应的颜色值并将它乘以光源的镜面强度，一个像素越「白」，乘积就会越大，物体的镜面光分量就会越亮。

由于箱子大部分都由木头所组成，而且木头材质应该没有镜面高光，所以漫反射纹理的整个木头部分全部都转换成了黑色，箱子钢制边框的镜面光强度是有细微变化的，钢铁本身会比较容易受到镜面高光的影响，而裂缝则不会

使用Photoshop或Gimp之类的工具，将漫反射纹理转换为镜面光纹理还是比较容易的，只需要剪切掉一些部分，将图像转换为黑白的，并增加亮度/对比度就好了

采样镜面光贴图

镜面光贴图和其它的纹理非常类似，所以代码也和漫反射贴图的代码很类似，记得要保证正确地加载图像并生成一个纹理对象

  1. unsigned int specularMap = loadTexture("container2_specular.png");

由于我们正在同一个片段着色器中使用另一个纹理采样器，我们必须要对镜面光贴图使用一个不同的纹理单元，所以我们在渲染之前先把它绑定到合适的纹理单元上：

  1. lightingShader.setInt("material.specular", 1);
  2. //渲染循环
  3. glActiveTexture(GL_TEXTURE1);
  4. glBindTexture(GL_TEXTURE_2D, specularMap);

接下来更新片段着色器的材质属性，让其接受一个sampler2D而不是vec3作为镜面光分量：

  1. struct Material {
  2.     sampler2D diffuse;
  3.     sampler2D specular;
  4.     float     shininess;
  5. };

最后我们希望采样镜面光贴图，来获取片段所对应的镜面光强度：

  1. vec3 specular = light.specular * spec * vec3(texture(material.specular, TexCoords));

如果你想另辟蹊径，你也可以在镜面光贴图中使用真正的颜色，不仅设置每个片段的镜面光强度，还设置了镜面高光的颜色。从现实角度来说，镜面高光的颜色大部分（甚至全部）都是由光源本身所决定的，所以这样并不能生成非常真实的视觉效果（这也是为什么图像通常是黑白的，我们只关心强度）

运行程序，可以看到箱子的材质现在和真实的钢制边框箱子非常类似了，更加awesome了

你也可以试试使用漫反射贴图创建一个彩色而不是黑白的镜面光贴图，看看结果看起来并不是那么真实了，比如这张彩色的镜面光贴图

放射光贴图

你可以自行添加一个叫做放射光贴图(Emission Map)的东西，它是一个储存了每个片段的发光值(Emission Value)的贴图，发光值是一个包含（假设）光源的物体发光(Emit)时可能显现的颜色，这样的话物体就能够忽略光照条件进行发光(Glow)

游戏中某个物体在发光的时候，你通常看到的就是放射光贴图

完整代码：

  1. //main.cpp
  2. #include <glad/glad.h>
  3. #include <GLFW/glfw3.h>
  5. #include <iostream> 
  7. #include "shader_s.h"
  8. #include "camera.h"
  10. #define STB_IMAGE_IMPLEMENTATION
  11. #include "stb_image.h"
  13. #include <glm/glm.hpp>
  14. #include <glm/gtc/matrix_transform.hpp>
  15. #include <glm/gtc/type_ptr.hpp>
  17. void framebuffer_size_callback(GLFWwindow* window, int width, int height);
  18. void mouse_callback(GLFWwindow* window, double xpos, double ypos);
  19. void scroll_callback(GLFWwindow* window, double xoffset, double yoffset);
  20. void processInput(GLFWwindow *window);
  21. unsigned int loadTexture(char const * path);
  23. // settings
  24. const unsigned int SCR_WIDTH = 800;
  25. const unsigned int SCR_HEIGHT = 600;
  27. // camera
  28. Camera camera(glm::vec3(0.0f, 0.0f, 3.0f));
  29. float lastX = SCR_WIDTH / 2.0f;
  30. float lastY = SCR_HEIGHT / 2.0f;
  31. bool firstMouse = true;
  33. float deltaTime = 0.0f; // 当前帧与上一帧的时间差
  34. float lastFrame = 0.0f; // 上一帧的时间
  36. glm::vec3 lightPos(1.2f, 1.0f, 2.0f);
  38. int main()
  39. {
  40.     // glfw初始化
  41.     glfwInit();
  42.     glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
  43.     glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
  44.     glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
  46.     // glfw创建窗口
  47.     GLFWwindow* window = glfwCreateWindow(SCR_WIDTH, SCR_HEIGHT, "LearnOpenGL", NULL, NULL);
  48.     if (window == NULL)
  49.     {
  50.         std::cout << "Failed to create GLFW window" << std::endl;
  51.         glfwTerminate();
  52.         return -1;
  53.     }
  54.     glfwMakeContextCurrent(window);
  55.     glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);
  56.     glfwSetCursorPosCallback(window, mouse_callback);
  57.     glfwSetScrollCallback(window, scroll_callback);
  59.     // 捕捉鼠标
  60.     glfwSetInputMode(window, GLFW_CURSOR, GLFW_CURSOR_DISABLED);
  62.     // glad加载所有OpenGL函数指针
  63.     if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
  64.     {
  65.         std::cout << "Failed to initialize GLAD" << std::endl;
  66.         return -1;
  67.     }
  69.     glEnable(GL_DEPTH_TEST);
  71.     Shader lightingShader("colorVertex.txt", "colorFragment.txt");// 起什么名字自己定
  72.     Shader lampShader("lampVertex.txt", "lampFragment.txt");
  74.     float vertices[] = {
  75.         // positions          // normals           // texture coords
  76.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  77.          0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 0.0f,
  78.          0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  79.          0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f, 1.0f,
  80.         -0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 1.0f,
  81.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f, 0.0f,
  83.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  84.          0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 0.0f,
  85.          0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  86.          0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   1.0f, 1.0f,
  87.         -0.5f,  0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 1.0f,
  88.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f, 1.0f,   0.0f, 0.0f,
  90.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  91.         -0.5f,  0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  92.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  93.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  94.         -0.5f, -0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  95.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  97.          0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  98.          0.5f,  0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 1.0f,
  99.          0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  100.          0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 1.0f,
  101.          0.5f, -0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  0.0f, 0.0f,
  102.          0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f, 0.0f,
  104.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  105.          0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 1.0f,
  106.          0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  107.          0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f, 0.0f,
  108.         -0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 0.0f,
  109.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f, 1.0f,
  111.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f,
  112.          0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 1.0f,
  113.          0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  114.          0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f, 0.0f,
  115.         -0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 0.0f,
  116.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f, 1.0f
  117.     };
  119.     unsigned int VBO;
  120.     glGenBuffers(1, &VBO);
  122.     unsigned int cubeVAO;
  123.     glGenVertexArrays(1, &cubeVAO);
  124.     glBindVertexArray(cubeVAO);
  126.     glBindBuffer(GL_ARRAY_BUFFER, VBO);
  127.     glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);
  128.     glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)0);
  129.     glEnableVertexAttribArray(0);
  130.     glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(3 * sizeof(float)));
  131.     glEnableVertexAttribArray(1);
  132.     glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 8 * sizeof(float), (void*)(6 * sizeof(float)));
  133.     glEnableVertexAttribArray(2);
  136.     unsigned int lightVAO;
  137.     glGenVertexArrays(1, &lightVAO);
  138.     glBindVertexArray(lightVAO);
  140.     glBindBuffer(GL_ARRAY_BUFFER, VBO);
  142.     glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);
  143.     glEnableVertexAttribArray(0);
  145.     unsigned int diffuseMap = loadTexture("container2.png");
  146.     unsigned int specularMap = loadTexture("container2_specular.png");
  148.     lightingShader.use();
  149.     lightingShader.setInt("material.diffuse", 0);
  150.     lightingShader.setInt("material.specular", 1);
  153.     // 渲染循环
  154.     while (!glfwWindowShouldClose(window))
  155.     {
  156.         // 帧时间差
  157.         float currentFrame = glfwGetTime();
  158.         deltaTime = currentFrame - lastFrame;
  159.         lastFrame = currentFrame;
  161.         // 输入
  162.         processInput(window);
  164.         // 渲染指令
  165.         glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
  166.         glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
  168.         lightingShader.use();
  169.         lightingShader.setVec3("objectColor", 1.0f, 0.5f, 0.31f);
  170.         lightingShader.setVec3("lightColor", 1.0f, 1.0f, 1.0f);
  171.         lightingShader.setVec3("lightPos", lightPos);
  172.         lightingShader.setVec3("viewPos", camera.Position);
  174.         lightingShader.setVec3("material.ambient", 1.0f, 0.5f, 0.31f);
  175.         lightingShader.setVec3("material.diffuse", 1.0f, 0.5f, 0.31f);
  176.         lightingShader.setVec3("material.specular", 0.5f, 0.5f, 0.5f);
  177.         lightingShader.setFloat("material.shininess", 32.0f);
  179.         lightingShader.setVec3("light.ambient", 0.2f, 0.2f, 0.2f);
  180.         lightingShader.setVec3("light.diffuse", 0.7f, 0.7f, 0.7f); // 将光照调暗了一些以搭配场景
  181.         lightingShader.setVec3("light.specular", 1.0f, 1.0f, 1.0f);
  183.         // 初始化变换矩阵
  184.         glm::mat4 projection = glm::perspective(glm::radians(camera.Zoom), (float)SCR_WIDTH / (float)SCR_HEIGHT, 0.1f, 100.0f);
  185.         glm::mat4 view = camera.GetViewMatrix();
  186.         lightingShader.setMat4("projection", projection);
  187.         lightingShader.setMat4("view", view);
  189.         glm::mat4 model = glm::mat4();
  190.         lightingShader.setMat4("model", model);
  192.         glActiveTexture(GL_TEXTURE0);
  193.         glBindTexture(GL_TEXTURE_2D, diffuseMap);
  194.         glActiveTexture(GL_TEXTURE1);
  195.         glBindTexture(GL_TEXTURE_2D, specularMap);
  197.         glBindVertexArray(cubeVAO);
  198.         glDrawArrays(GL_TRIANGLES, 0, 36);
  200.         model = glm::translate(model, lightPos);
  201.         model = glm::scale(model, glm::vec3(0.2f));
  203.         lampShader.use();
  204.         // 设置模型、视图和投影矩阵uniform
  205.         lampShader.setMat4("projection", projection);
  206.         lampShader.setMat4("view", view);
  207.         model = glm::mat4(1.0f);
  208.         model = glm::translate(model, lightPos);
  209.         model = glm::scale(model, glm::vec3(0.2f)); // 小点的立方体
  210.         lampShader.setMat4("model", model);
  211.         // 绘制灯立方体对象
  212.         glBindVertexArray(lightVAO);
  213.         glDrawArrays(GL_TRIANGLES, 0, 36);
  216.         // 交换缓冲并查询IO事件
  217.         glfwSwapBuffers(window);
  218.         glfwPollEvents();
  219.     }
  220.     glDeleteVertexArrays(1, &cubeVAO);
  221.     glDeleteBuffers(1, &VBO);
  223.     glfwTerminate();
  224.     return 0;
  225. }
  227. void processInput(GLFWwindow *window)
  228. {
  229.     if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)//是否按下了返回键
  230.         glfwSetWindowShouldClose(window, true);
  232.     if (glfwGetKey(window, GLFW_KEY_W) == GLFW_PRESS)
  233.         camera.ProcessKeyboard(FORWARD, deltaTime);
  234.     if (glfwGetKey(window, GLFW_KEY_S) == GLFW_PRESS)
  235.         camera.ProcessKeyboard(BACKWARD, deltaTime);
  236.     if (glfwGetKey(window, GLFW_KEY_A) == GLFW_PRESS)
  237.         camera.ProcessKeyboard(LEFT, deltaTime);
  238.     if (glfwGetKey(window, GLFW_KEY_D) == GLFW_PRESS)
  239.         camera.ProcessKeyboard(RIGHT, deltaTime);
  240. }
  242. void framebuffer_size_callback(GLFWwindow* window, int width, int height)
  243. {
  244.     glViewport(0, 0, width, height);
  245. }
  247. void mouse_callback(GLFWwindow* window, double xpos, double ypos)
  248. {
  249.     if (firstMouse)
  250.     {
  251.         lastX = xpos;
  252.         lastY = ypos;
  253.         firstMouse = false;
  254.     }
  256.     float xoffset = xpos - lastX;
  257.     float yoffset = lastY - ypos; // reversed since y-coordinates go from bottom to top
  259.     lastX = xpos;
  260.     lastY = ypos;
  262.     camera.ProcessMouseMovement(xoffset, yoffset);
  263. }
  265. void scroll_callback(GLFWwindow* window, double xoffset, double yoffset)
  266. {
  267.     camera.ProcessMouseScroll(yoffset);
  268. }
  270. unsigned int loadTexture(char const * path)
  271. {
  272.     unsigned int textureID;
  273.     glGenTextures(1, &textureID);
  275.     int width, height, nrComponents;
  276.     unsigned char *data = stbi_load(path, &width, &height, &nrComponents, 0);
  277.     if (data)
  278.     {
  279.         GLenum format;
  280.         if (nrComponents == 1)
  281.             format = GL_RED;
  282.         else if (nrComponents == 3)
  283.             format = GL_RGB;
  284.         else if (nrComponents == 4)
  285.             format = GL_RGBA;
  287.         glBindTexture(GL_TEXTURE_2D, textureID);
  288.         glTexImage2D(GL_TEXTURE_2D, 0, format, width, height, 0, format, GL_UNSIGNED_BYTE, data);
  289.         glGenerateMipmap(GL_TEXTURE_2D);
  291.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
  292.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
  293.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR_MIPMAP_LINEAR);
  294.         glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
  296.         stbi_image_free(data);
  297.     }
  298.     else
  299.     {
  300.         std::cout << "Texture failed to load at path: " << path << std::endl;
  301.         stbi_image_free(data);
  302.     }
  304.     return textureID;
  305. }
  1. //colorFragment.txt
  2. #version 330 core
  4. struct Material {
  5.     sampler2D diffuse;
  6.     sampler2D specular;
  7.     float     shininess;
  8. };
  10. struct Light {
  11.     vec3 position;
  13.     vec3 ambient;
  14.     vec3 diffuse;
  15.     vec3 specular;
  16. };
  18. in vec2 TexCoords; 
  20. in vec3 Normal;
  21. in vec3 FragPos;
  23. out vec4 FragColor;
  25. uniform Material material;
  26. uniform Light light;
  28. uniform vec3 objectColor;
  29. uniform vec3 lightColor;
  30. uniform vec3 lightPos;
  31. uniform vec3 viewPos;
  33. float specularStrength = 0.5;
  35. void main()
  36. {    
  37.     // 环境光
  38.     vec3 ambient = light.ambient * vec3(texture(material.diffuse, TexCoords));
  40.     // 漫反射 
  41.     vec3 norm = normalize(Normal);
  42.     vec3 lightDir = normalize(lightPos - FragPos);
  43.     float diff = max(dot(norm, lightDir), 0.0);
  44.     vec3 diffuse = light.diffuse * diff * vec3(texture(material.diffuse, TexCoords));
  46.     // 镜面光
  47.     vec3 viewDir = normalize(viewPos - FragPos);
  48.     vec3 reflectDir = reflect(-lightDir, norm);  
  49.     float spec = pow(max(dot(viewDir, reflectDir), 0.0), material.shininess);
  50.     vec3 specular = light.specular * spec * vec3(texture(material.specular, TexCoords));
  52.     vec3 result = ambient + diffuse + specular;
  53.     FragColor = vec4(result, 1.0);
  54. }
  1. //colorVertex.txt
  2. #version 330 core
  4. layout (location = 0) in vec3 aPos;
  5. layout (location = 1) in vec3 aNormal;
  6. layout (location = 2) in vec2 aTexCoords;
  8. out vec3 FragPos;  
  9. out vec3 Normal;
  11. out vec2 TexCoords;
  13. uniform mat4 model;
  14. uniform mat4 view;
  15. uniform mat4 projection;
  17. void main()
  18. {
  19.     TexCoords = aTexCoords;
  20.     gl_Position = projection * view * model * vec4(aPos, 1.0);
  21.     Normal = mat3(transpose(inverse(model))) * aNormal;
  22.     FragPos = vec3(model * vec4(aPos, 1.0));
  23. }

原文链接：http://www.cnblogs.com/zhxmdefj/p/11365819.html

 友情链接：直通硅谷 　点职佳 　北美留学生论坛

OpenGL热门文章

  • OpenGL实例：纹理映射
  • WebGL或OpenGL关于模型视图投影变换的技巧
  • QT OpenGLWidget的surfaceFormat
  • 在Visual Studio 2017上配置并使用OpenGL
  • Mac CLion下OpenGL环境配置
  • QT OpenGLWidget高分屏适配时出现的问题
  • Opengl ES之YUV数据渲染
  • LearnOpenGL学习笔记（一）画个三角形
  • LearnOpenGL学习笔记（二）纹理
  • OpenGL笔记（4）纹理

    • OpenGL推荐文章

  • Avalonia 跨平台框架中如何以正确的姿势使用 OpenGL ES 渲染。
  • 解密视频魔法：将ExternalOES纹理转化为TEXTURE_2D纹理
  • Opengl ES之YUV数据渲染
  • 使用 Silk.NET 创建 OpenGL 空窗口项目例子
  • OpenGL笔记（4）纹理
  • LearnOpenGL学习笔记（一）画个三角形
  • LearnOpenGL笔记（2）三角形
  • OpenGL光照2：材质和光照贴图
  • OpenGL入门3：渲染管线简介，三角形
  • OpenGl入门2：第一个窗口

    • 本站QQ群：前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

    W3xue 的所有内容仅供测试，对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
    关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接（目前9元/月）请联系QQ：27243702 沸活量
    皖ICP备17017327号-2　皖公网安备34020702000426号