OpenGL with QtWidgets：材质、光照贴图

妖狐艹你老母 2022-09-12 04:44 301阅读 0赞

（本文是LearnOpenGL的学习笔记， 教程中文翻译地址https://learnopengl-cn.github.io/（备用地址https://learnopengl-cn.readthedocs.io/zh/latest/），写于 2021-9-20）

0.前言

上一节学习了基础光照（https://mp.csdn.net/mp_blog/creation/editor/106005766），教程接下来讲了材质和光照贴图。

1.知识点

如果我们想要在OpenGL中模拟多种类型的物体，我们必须为每个物体分别定义一个材质(Material)属性。可以用这三个分量来定义一个材质颜色(Material Color)：环境光照(Ambient Lighting)、漫反射光照(Diffuse Lighting)和镜面光照(Specular Lighting)。通过为每个分量指定一个颜色，我们就能够对物体的颜色输出有着精细的控制了。再添加反光度(Shininess)这个分量到上述的三个颜色中，这就有我们需要的所有材质属性了：

  1. struct Material {
  2.     vec3 ambient;
  3.     vec3 diffuse;
  4.     vec3 specular;
  5.     float shininess;
  6. }; 
  7. uniform Material material;

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

现实世界中的物体通常并不只包含有一种材质，而是由多种材质所组成。引入漫反射和镜面光贴图(Map)。这允许我们对物体的漫反射分量（以及间接地对环境光分量，它们几乎总是一样的）和镜面光分量有着更精确的控制。

  1. struct Material {
  2.     sampler2D diffuse; //环境光和漫反射取同一个纹理
  3.     sampler2D specular;
  4.     float shininess;
  5. };

2.实现代码

（项目git链接：https://github.com/gongjianbo/OpenGLwithQtWidgets.git）

为了简化代码，我把 Camrea 观察矩阵给固定了不能旋转和移动

材质效果：

watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6b6a5bu65rOi_size_14_color_FFFFFF_t_70_g_se_x_16

光照贴图效果：

watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA6b6a5bu65rOi_size_15_color_FFFFFF_t_70_g_se_x_16

光照贴图部分的代码（GLLightingMap类）如下：

  1. #pragma once
  2. #include <QOpenGLWidget>
  3. #include <QOpenGLFunctions_3_3_Core>
  4. #include <QOpenGLShaderProgram>
  5. #include <QOpenGLVertexArrayObject>
  6. #include <QOpenGLBuffer>
  7. #include <QOpenGLTexture>
  8. #include <QVector3D>
  9. #include <QMatrix4x4>
  10. #include <QQuaternion>
  11. #include <QTimer>
  13. //光照贴图
  14. //QOpenGLWidget窗口上下文
  15. //QOpenGLFunctions访问OpenGL接口，可以不继承作为成员变量使用
  16. class GLLightingMap
  17.         : public QOpenGLWidget
  18.         , protected QOpenGLFunctions_3_3_Core
  19. {
  20.     Q_OBJECT
  21. public:
  22.     explicit GLLightingMap(QWidget *parent = nullptr);
  23.     ~GLLightingMap();
  25. protected:
  26.     //【】继承QOpenGLWidget后重写这三个虚函数
  27.     //设置OpenGL资源和状态。在第一次调用resizeGL或paintGL之前被调用一次
  28.     void initializeGL() override;
  29.     //渲染OpenGL场景，每当需要更新小部件时使用
  30.     void paintGL() override;
  31.     //设置OpenGL视口、投影等，每当尺寸大小改变时调用
  32.     void resizeGL(int width, int height) override;
  34. private:
  35.     void initShader();
  36.     QOpenGLTexture *initTexture(const QString &imgpath);
  38. private:
  39.     //着色器程序
  40.     QOpenGLShaderProgram lightingShader,lampShader;
  41.     //顶点数组对象
  42.     QOpenGLVertexArrayObject lightingVao,lampVao;
  43.     //顶点缓冲
  44.     QOpenGLBuffer vbo;
  45.     //纹理
  46.     QOpenGLTexture *diffuseMap{ nullptr };
  47.     QOpenGLTexture *specularMap{ nullptr };
  48.     //
  49.     QTimer timer;
  50.     int rotate{ 0 };
  51. };
  53. #include "GLLightingMap.h"
  54. #include <cmath>
  55. #include <QtMath>
  56. #include <QDebug>
  58. GLLightingMap::GLLightingMap(QWidget *parent)
  59.     : QOpenGLWidget(parent)
  60. {
  61.     connect(&timer,&QTimer::timeout,this,[this](){
  62.         rotate+=1;
  63.         if(isVisible()){
  64.             update();
  65.         }
  66.     });
  67.     timer.setInterval(50);
  68. }
  70. GLLightingMap::~GLLightingMap()
  71. {
  72.     //initializeGL在显示时才调用，释放未初始化的会异常
  73.     if(!isValid())
  74.         return;
  75.     //QOpenGLWidget
  76.     //三个虚函数不需要makeCurrent，对应的操作已由框架完成
  77.     //但是释放时需要设置当前上下文
  78.     makeCurrent();
  79.     vbo.destroy();
  80.     lightingVao.destroy();
  81.     lampVao.destroy();
  82.     delete diffuseMap;
  83.     delete specularMap;
  84.     doneCurrent();
  85. }
  87. void GLLightingMap::initializeGL()
  88. {
  89.     //为当前上下文初始化OpenGL函数解析
  90.     initializeOpenGLFunctions();
  91.     initShader();
  93.     //方块的顶点、法向量、纹理坐标
  94.     float vertices[] = {
  95.         // positions          // normals           // texture coords
  96.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f,  0.0f,
  97.         0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f,  0.0f,
  98.         0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f,  1.0f,
  99.         0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  1.0f,  1.0f,
  100.         -0.5f,  0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f,  1.0f,
  101.         -0.5f, -0.5f, -0.5f,  0.0f,  0.0f, -1.0f,  0.0f,  0.0f,
  103.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  0.0f,  0.0f,
  104.         0.5f, -0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  1.0f,  0.0f,
  105.         0.5f,  0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  1.0f,  1.0f,
  106.         0.5f,  0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  1.0f,  1.0f,
  107.         -0.5f,  0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  0.0f,  1.0f,
  108.         -0.5f, -0.5f,  0.5f,  0.0f,  0.0f,  1.0f,  0.0f,  0.0f,
  110.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f,  0.0f,
  111.         -0.5f,  0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  1.0f,  1.0f,
  112.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f,  1.0f,
  113.         -0.5f, -0.5f, -0.5f, -1.0f,  0.0f,  0.0f,  0.0f,  1.0f,
  114.         -0.5f, -0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  0.0f,  0.0f,
  115.         -0.5f,  0.5f,  0.5f, -1.0f,  0.0f,  0.0f,  1.0f,  0.0f,
  117.         0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f,  0.0f,
  118.         0.5f,  0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  1.0f,  1.0f,
  119.         0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f,  1.0f,
  120.         0.5f, -0.5f, -0.5f,  1.0f,  0.0f,  0.0f,  0.0f,  1.0f,
  121.         0.5f, -0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  0.0f,  0.0f,
  122.         0.5f,  0.5f,  0.5f,  1.0f,  0.0f,  0.0f,  1.0f,  0.0f,
  124.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f,  1.0f,
  125.         0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  1.0f,  1.0f,
  126.         0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f,  0.0f,
  127.         0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  1.0f,  0.0f,
  128.         -0.5f, -0.5f,  0.5f,  0.0f, -1.0f,  0.0f,  0.0f,  0.0f,
  129.         -0.5f, -0.5f, -0.5f,  0.0f, -1.0f,  0.0f,  0.0f,  1.0f,
  131.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f,  1.0f,
  132.         0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  1.0f,  1.0f,
  133.         0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f,  0.0f,
  134.         0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  1.0f,  0.0f,
  135.         -0.5f,  0.5f,  0.5f,  0.0f,  1.0f,  0.0f,  0.0f,  0.0f,
  136.         -0.5f,  0.5f, -0.5f,  0.0f,  1.0f,  0.0f,  0.0f,  1.0f
  137.     };
  139.     vbo=QOpenGLBuffer(QOpenGLBuffer::VertexBuffer);
  140.     vbo.create();
  142.     //light vao
  143.     lightingVao.create();
  144.     lightingVao.bind();
  145.     vbo.bind();
  146.     vbo.allocate(vertices,sizeof(vertices));
  147.     //setAttributeBuffer(int location, GLenum type, int offset, int tupleSize, int stride = 0)
  148.     lightingShader.setAttributeBuffer(0, GL_FLOAT, sizeof(GLfloat) * 0, 3, sizeof(GLfloat) * 8);
  149.     lightingShader.enableAttributeArray(0);
  150.     lightingShader.setAttributeBuffer(1, GL_FLOAT, sizeof(GLfloat) * 3, 3, sizeof(GLfloat) * 8);
  151.     lightingShader.enableAttributeArray(1);
  152.     lightingShader.setAttributeBuffer(2, GL_FLOAT, sizeof(GLfloat) * 6, 2, sizeof(GLfloat) * 8);
  153.     lightingShader.enableAttributeArray(2);
  154.     vbo.release();
  155.     lightingVao.release();
  157.     //lamp vao
  158.     lampVao.create();
  159.     lampVao.bind();
  160.     vbo.bind();
  161.     //setAttributeBuffer(int location, GLenum type, int offset, int tupleSize, int stride = 0)
  162.     lampShader.setAttributeBuffer(0, GL_FLOAT, 0, 3, sizeof(GLfloat) * 8);
  163.     lampShader.enableAttributeArray(0);
  164.     vbo.release();
  165.     lampVao.release();
  167.     //纹理
  168.     diffuseMap = initTexture(":/container2.png");
  169.     specularMap = initTexture(":/container2_specular.png");
  170.     //shader configuration
  171.     lightingShader.bind();
  172.     lightingShader.setUniformValue("material.diffuse", 0);
  173.     lightingShader.setUniformValue("material.specular", 1);
  174.     lightingShader.release();
  176.     timer.start();
  177. }
  179. void GLLightingMap::paintGL()
  180. {
  181.     glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
  182.     //清除深度缓冲
  183.     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
  185.     //Z缓冲(Z-buffer),深度缓冲(Depth Buffer)。
  186.     glEnable(GL_DEPTH_TEST);
  188.     //draw lighting
  189.     lightingShader.bind();
  190.     QMatrix4x4 view; //观察矩阵
  191.     view.translate(0.0f, 0.0f, -5.0f);
  192.     view.rotate(45, QVector3D(1.0f, 0.8f, 0.0f));
  193.     lightingShader.setUniformValue("view", view);
  194.     QMatrix4x4 projection; //透视投影
  195.     projection.perspective(45.0f, 1.0f * width() / height(), 0.1f, 100.0f);
  196.     lightingShader.setUniformValue("projection", projection);
  197.     QMatrix4x4 model;//模型矩阵
  198.     lightingShader.setUniformValue("model", model);
  199.     //因为要获取灯的位置，所以提前算灯的model矩阵
  200.     model = QMatrix4x4();
  201.     model.translate(QVector3D(1.0f, 1.0f, -1.0f));
  202.     model.scale(0.3f);
  203.     QVector3D light_pos = model.map(QVector3D(0.0f, 0.0f, 0.0f));
  204.     QMatrix4x4 vv = view.inverted(); //逆矩阵求观察点位置
  205.     QVector3D view_pos = vv.map(QVector3D(0.0f, 0.0f, 0.0f));
  206.     lightingShader.setUniformValue("light.position", light_pos);
  207.     lightingShader.setUniformValue("viewPos", view_pos);
  208.     //光照-light properties
  209.     QVector3D light_color = QVector3D(1.0f, 1.0f, 1.0f);
  210.     QVector3D diffuse_color = light_color * 0.5f; // decrease the influence
  211.     QVector3D ambient_color = diffuse_color * 0.2f; // low influence
  212.     lightingShader.setUniformValue("light.ambient", ambient_color);
  213.     lightingShader.setUniformValue("light.diffuse", diffuse_color);
  214.     lightingShader.setUniformValue("light.specular", QVector3D(1.0f, 1.0f, 1.0f));
  216.     //材质-material properties
  217.     //shininess影响镜面高光的散射/半径
  218.     lightingShader.setUniformValue("material.shininess", 64.0f);
  219.     lightingVao.bind();
  220.     //绑定2d纹理
  221.     //bind diffuse map
  222.     glActiveTexture(GL_TEXTURE0);
  223.     diffuseMap->bind();
  224.     //bind specular map
  225.     glActiveTexture(GL_TEXTURE1);
  226.     specularMap->bind();
  227.     glDrawArrays(GL_TRIANGLES, 0, 36);
  228.     lightingVao.release();
  229.     lightingShader.release();
  231.     //draw lamp
  232.     lampShader.bind();
  233.     lampShader.setUniformValue("view", view);
  234.     lampShader.setUniformValue("projection", projection);
  235.     lampShader.setUniformValue("model", model);
  236.     lampVao.bind();
  237.     glDrawArrays(GL_TRIANGLES, 0, 36);
  238.     lampVao.release();
  239.     lampShader.release();
  240. }
  242. void GLLightingMap::resizeGL(int width, int height)
  243. {
  244.     glViewport(0, 0, width, height);
  245. }
  247. void GLLightingMap::initShader()
  248. {
  249.     //lingting shader
  250.     //in输入，out输出,uniform从cpu向gpu发送
  251.     const char *lighting_vertex=R"(#version 330 core
  252. layout (location = 0) in vec3 aPos;
  253. layout (location = 1) in vec3 aNormal;
  254. layout (location = 2) in vec2 aTexCoords;
  256. out vec3 FragPos;
  257. out vec3 Normal;
  258. out vec2 TexCoords;
  260. uniform mat4 model;
  261. uniform mat4 view;
  262. uniform mat4 projection;
  264. void main()
  265. {
  266.     FragPos = vec3(model * vec4(aPos, 1.0));
  267.     Normal = mat3(transpose(inverse(model))) * aNormal;
  268.     TexCoords = aTexCoords;
  270.     gl_Position = projection * view * vec4(FragPos, 1.0);
  271. })";
  272.     const char *lighting_fragment=R"(#version 330 core
  273. out vec4 FragColor;
  275. struct Material {
  276.     sampler2D diffuse;
  277.     sampler2D specular;
  278.     float shininess;
  279. };
  281. struct Light {
  282.     vec3 position;
  284.     vec3 ambient;
  285.     vec3 diffuse;
  286.     vec3 specular;
  287. };
  289. in vec3 FragPos;
  290. in vec3 Normal;
  291. in vec2 TexCoords;
  293. uniform vec3 viewPos;
  294. uniform Material material;
  295. uniform Light light;
  297. void main()
  298. {
  299.     // ambient
  300.     vec3 ambient = light.ambient * texture(material.diffuse, TexCoords).rgb;
  302.     // diffuse
  303.     vec3 norm = normalize(Normal);
  304.     vec3 lightDir = normalize(light.position - FragPos);
  305.     float diff = max(dot(norm, lightDir), 0.0);
  306.     vec3 diffuse = light.diffuse * diff * texture(material.diffuse, TexCoords).rgb;
  308.     // specular
  309.     vec3 viewDir = normalize(viewPos - FragPos);
  310.     vec3 reflectDir = reflect(-lightDir, norm);
  311.     float spec = pow(max(dot(viewDir, reflectDir), 0.0), material.shininess);
  312.     vec3 specular = light.specular * spec * texture(material.specular, TexCoords).rgb;
  314.     vec3 result = ambient + diffuse + specular;
  315.     FragColor = vec4(result, 1.0);
  316. })";
  318.     //将source编译为指定类型的着色器，并添加到此着色器程序
  319.     if(!lightingShader.addCacheableShaderFromSourceCode(
  320.                 QOpenGLShader::Vertex,lighting_vertex)){
  321.         qDebug()<<"compiler vertex error"<<lightingShader.log();
  322.     }
  323.     if(!lightingShader.addCacheableShaderFromSourceCode(
  324.                 QOpenGLShader::Fragment,lighting_fragment)){
  325.         qDebug()<<"compiler fragment error"<<lightingShader.log();
  326.     }
  327.     //使用addShader()将添加到该程序的着色器链接在一起。
  328.     if(!lightingShader.link()){
  329.         qDebug()<<"link shaderprogram error"<<lightingShader.log();
  330.     }
  332.     //lamp shader
  333.     const char *lamp_vertex=R"(#version 330 core
  334. layout (location = 0) in vec3 aPos;
  335. uniform mat4 model;
  336. uniform mat4 view;
  337. uniform mat4 projection;
  339. void main()
  340. {
  341. gl_Position = projection * view * model * vec4(aPos, 1.0f);
  342. })";
  343.     const char *lamp_fragment=R"(#version 330 core
  344. out vec4 FragColor;
  345. void main()
  346. {
  347. FragColor = vec4(1.0);
  348. })"; // set alle 4 vector values to 1.0
  350.     if(!lampShader.addCacheableShaderFromSourceCode(
  351.                 QOpenGLShader::Vertex,lamp_vertex)){
  352.         qDebug()<<"compiler vertex error"<<lampShader.log();
  353.     }
  354.     if(!lampShader.addCacheableShaderFromSourceCode(
  355.                 QOpenGLShader::Fragment,lamp_fragment)){
  356.         qDebug()<<"compiler fragment error"<<lampShader.log();
  357.     }
  358.     if(!lampShader.link()){
  359.         qDebug()<<"link shaderprogram error"<<lampShader.log();
  360.     }
  361. }
  363. QOpenGLTexture *GLLightingMap::initTexture(const QString &imgpath)
  364. {
  365.     QOpenGLTexture *texture = new QOpenGLTexture(QImage(imgpath), QOpenGLTexture::GenerateMipMaps);
  366.     if(!texture->isCreated()){
  367.         qDebug() << "Failed to create texture";
  368.     }
  369.     //set the texture wrapping parameters
  370.     //等于glTexParameteri(GLtexture_2D, GLtexture_WRAP_S, GL_REPEAT);
  371.     texture->setWrapMode(QOpenGLTexture::DirectionS, QOpenGLTexture::Repeat);
  372.     texture->setWrapMode(QOpenGLTexture::DirectionT, QOpenGLTexture::Repeat);//
  373.     //set texture filtering parameters
  374.     //等价于glTexParameteri(GLtexture_2D, GLtexture_MIN_FILTER, GL_LINEAR);
  375.     texture->setMinificationFilter(QOpenGLTexture::Linear);
  376.     texture->setMagnificationFilter(QOpenGLTexture::Linear);
  377.     return texture;
  378. }

3.参考

LearnOpenGL：https://learnopengl-cn.github.io/02%20Lighting/04%20Lighting%20maps/

博客（Qt+OpenGL）：https://www.jianshu.com/p/855ce8d81849

博客（Qt+OpenGL）：https://blog.csdn.net/z136411501/article/details/80149125

博客（Qt+OpenGL）：https://blog.csdn.net/qq_40946921/article/details/106200378

发表评论

表情：
评论列表 （有 0 条评论，301人围观）

还没有评论，来说两句吧...

相关阅读