Qt OPenGL 入门教程之四基于QOpenGLWidget 顶点着色

蔚落 2023-06-25 10:11 2阅读 0赞

前面绘制的图片还是纯白色的，并且看上去还是2D的正方形，这一节将为图形每个顶点着色，然后添加其他的面来形成3D效果。

//myopenglwidget.h
    #ifndef MYOPENGLWIDGET_H
    #define MYOPENGLWIDGET_H
    
    #include <QOpenGLWidget>
    #include <QOpenGLFunctions>
    #include <QOpenGLBuffer>
    
    class QOpenGLShaderProgram;
    
    class MyOpenGLWidget : public QOpenGLWidget, protected QOpenGLFunctions
    {
        Q_OBJECT
    
    public:
        explicit MyOpenGLWidget(QWidget *parent = 0);
    
    protected:
        void initializeGL();
        void paintGL();
        void resizeGL(int width, int height);
    
    private:
        QOpenGLShaderProgram *program;
        QOpenGLBuffer vbo;
    };
    
    #endif // MYOPENGLWIDGET_H
    
    
    //myopenglwidget.cpp
    #include "myopenglwidget.h"
    #include <QOpenGLShaderProgram>
    
    MyOpenGLWidget::MyOpenGLWidget(QWidget *parent)
        : QOpenGLWidget(parent)
    {
    }
    
    void MyOpenGLWidget::initializeGL()
    {
        // 为当前环境初始化OpenGL函数
        initializeOpenGLFunctions();
    
        // 创建顶点着色器
        QOpenGLShader *vshader = new QOpenGLShader(QOpenGLShader::Vertex, this);
        const char *vsrc =
                "in vec4 vPosition;                        \n"
                "in vec4 vColor;                           \n"
                "out vec4 color;                           \n"
                "void main() {                             \n"
                "   color = vColor;                        \n"
                "   gl_Position = vPosition;               \n"
                "}                                         \n";
        vshader->compileSourceCode(vsrc);
        // 创建片段着色器
        QOpenGLShader *fshader = new QOpenGLShader(QOpenGLShader::Fragment, this);
        const char *fsrc =
                "in vec4 color;                             \n"
                "out vec4 fColor;                           \n"
                "void main() {                              \n"
                "   fColor = color;                         \n"
                "}                                          \n";
        fshader->compileSourceCode(fsrc);
    
        // 创建着色器程序
        program = new QOpenGLShaderProgram;
        program->addShader(vshader);
        program->addShader(fshader);
    
        program->link();
        program->bind();
    }
    
    void MyOpenGLWidget::resizeGL(int , int )
    {  
    }
    
    void MyOpenGLWidget::paintGL()
    {
        int w = width();
        int h = height();
        int side = qMin(w, h);
        glViewport((w - side) / 2, (h - side) / 2, side, side);
    
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
    
        // 顶点位置
        GLfloat vertices[] = {
            -0.8f, 0.8f,
            -0.8f, -0.8f,
            0.8f, -0.8f,
            0.8f, 0.8f
        };
    
        vbo.create();
        vbo.bind();
        vbo.allocate(vertices, 20*sizeof(GLfloat));
    
        GLuint vPosition = program->attributeLocation("vPosition");
        program->setAttributeBuffer(vPosition, GL_FLOAT, 0, 2, 0);
        glEnableVertexAttribArray(vPosition);
    
    
        // 顶点颜色
        GLfloat colors[] = {
            1.0f, 0.0f, 0.0f,
            0.0f, 1.0f, 0.0f,
            0.0f, 0.0f, 1.0f,
            1.0f, 1.0f, 1.0f
        };
        vbo.write(8*sizeof(GLfloat), colors, 12*sizeof(GLfloat));
        GLuint vColor = program->attributeLocation("vColor");
        program->setAttributeBuffer(vColor, GL_FLOAT, 8*sizeof(GLfloat), 3, 0);
        glEnableVertexAttribArray(vColor);
    
        // 绘制
        glDrawArrays(GL_TRIANGLE_FAN, 0, 4);
    }
    
    
    
    //main.cpp
    #include <QApplication>
    #include "myopenglwidget.h"
    
    int main(int argc, char *argv[])
    {
        QApplication app(argc,argv);
        MyOpenGLWidget w;
        w.resize(400, 300);
        w.show();
        return app.exec();
    }

运行结果：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3A5NDIwMDU0MDU_size_16_color_FFFFFF_t_70][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3A5NDIwMDU0MDU_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191227235935555.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3A5NDIwMDU0MDU=,size_16,color_FFFFFF,t_70