第二课：你的第一个多边形

新建窗口类TriangleWindow，继承Openglwindow

trianglewindow.h代码

#ifndef TRIANGLEWINDOW_H
#define TRIANGLEWINDOW_H

#include "openglwindow.h"

#include <QtGui/QGuiApplication>
#include <QtGui/QMatrix4x4>
#include <QtGui/QOpenGLShaderProgram>
#include <QtGui/QScreen>
#include <QtCore/qmath.h>

class TriangleWindow: public Openglwindow
{
public:
    TriangleWindow();

    void initialize() override;
    void render() override;

private:
    //位置
    GLuint m_posAttr;
    //颜色
    GLuint m_colAttr;
    //矩阵
    GLuint m_matrixUniform;
    //着色器程序
    QOpenGLShaderProgram *m_program;
};

#endif // TRIANGLEWINDOW_H

trianglewindow.cpp代码

#include "trianglewindow.h"
#include <QDebug>

static const char *vertexShaderSource =
    "attribute highp vec4 posAttr;\n"
    "attribute lowp vec4 colAttr;\n"
    "varying lowp vec4 col;\n"
    "uniform highp mat4 matrix;\n"
    "void main() {\n"
    "   col = colAttr;\n"
    "   gl_Position = matrix * posAttr;\n"
    "}\n";

static const char *fragmentShaderSource =
    "varying lowp vec4 col;\n"
    "void main() {\n"
    "   gl_FragColor = col;\n"
    "}\n";

TriangleWindow::TriangleWindow()
    :m_program(0)
{

}

void TriangleWindow::initialize()
{
    //创建着色器程序
    m_program = new QOpenGLShaderProgram(this);
    //编译代码-添加顶点着色器
    m_program->addShaderFromSourceCode(QOpenGLShader::Vertex, vertexShaderSource);
    //编译代码-添加片段着色器
    m_program->addShaderFromSourceCode(QOpenGLShader::Fragment, fragmentShaderSource);

    //链接着色器
    m_program->link();

    //得到顶点属性名在着色器参数列表中的位置-0
    m_posAttr = m_program->attributeLocation("posAttr");
    //得到颜色属性名在着色器参数列表中的位置-1
    m_colAttr = m_program->attributeLocation("colAttr");
    //得到矩阵规格名在着色器参数列表中的位置-0
    m_matrixUniform = m_program->uniformLocation("matrix");
}

void TriangleWindow::render()
{
    //分辨率比例-1
    const qreal retinaScale = devicePixelRatio();

    //重置视口
    glViewport(0, 0, width() * retinaScale, height() * retinaScale);

    //清除颜色缓冲区
    glClear(GL_COLOR_BUFFER_BIT);

    //绑定着色器程序到活动的上下文
    m_program->bind();

    //4x4 矩阵
    QMatrix4x4 matrix;
    //乘以一个矩阵，为了建立透视投影矩阵
    matrix.perspective(60.0f, 4.0f/3.0f, 0.1f, 100.0f);
    //乘以这个矩阵，通过向量转换坐标
    matrix.translate(0, 0, -2);
    //乘以这个矩阵，通过向量上的角度旋转坐标
    matrix.rotate(0 / screen()->refreshRate(), 0, 1, 0);

    //设置矩阵数据
    m_program->setUniformValue(m_matrixUniform, matrix);

    //顶点坐标
    GLfloat vertices[] = {
        0.0f, 0.707f,
        -0.5f, -0.5f,
        0.5f, -0.5f
    };

    //颜色值-白色
    GLfloat colors[] = {
        1.0f, 1.0f, 1.0f,
        1.0f, 1.0f, 1.0f,
        1.0f, 1.0f, 1.0f
    };

    //glVertexAttribPointer 指定了渲染时索引值为 index 的顶点属性数组的数据格式和位置
    //设置顶点数据
    glVertexAttribPointer(m_posAttr, 2, GL_FLOAT, GL_FALSE, 0, vertices);
    //设置颜色数据
    glVertexAttribPointer(m_colAttr, 3, GL_FLOAT, GL_FALSE, 0, colors);

    //启用对应的顶点属性数组
    //顶点坐标
    glEnableVertexAttribArray(0);
    //颜色值
    glEnableVertexAttribArray(1);

    //绘制三角形
    glDrawArrays(GL_TRIANGLES, 0, 3);

    //停用对应的顶点属性数组
    glDisableVertexAttribArray(1);
    glDisableVertexAttribArray(0);

    //释放程序
    m_program->release();

}

main.cpp代码

#include <QtGui/QGuiApplication>
#include "openglwindow.h"
#include "trianglewindow.h"

int main(int argc, char **argv)
{
    QGuiApplication app(argc, argv);

    QSurfaceFormat format;
    //设置采样率
    format.setSamples(16);

    TriangleWindow window;
    window.setTitle(QStringLiteral("第二课：你的第一个多边形"));
    window.setFormat(format);
    window.resize(640, 480);
    window.show();

    return app.exec();
}

运行

0_1526363394212_QQ截图20180515134946.png