通过前两篇文章的学习,我想大家应该有了基本的理解,我们接下来实操一下。
创建Qt OpenGL窗口
QOpenGLWidget
QGLWidget是传统QtOpenGL模块的一部分,与其他QGL类一样,应该在新的应用程序中避免使用。相反,从Qt5.4开始,Qt推荐使用QOpenGLWidget和QOpenGL类。
QOpenGLWidget提供显示集成到Qt应用程序中的OpenGL图形的功能,使用起来非常简单。让类继承它,并像其他QWidget一样使用子类,额外可以选择使用QPainer和标准的OpenGL渲染命令。
QOpenGLWidget提供了三个方便的虚拟函数,可以在子类中重新实现这些函数来执行典型的OpenGL任务:
- initializeGL():设置OpenGL呈现上下文,定义显示列表等。在第一次调用resizeGL()或paintGL()之前调用一次。
- resizeGL():设置OpenGL视区、投影等。每当调整了大小时都会调用该视区(并且当它第一次显示时也会调用,因为所有新创建的小部件都会自动获得一个调整大小的事件)。
- paintGL():渲染OpenGL场景。每当需要更新小部件时调用。
QOpenGLExtraFunctions
QOpenGLExtraFunctions类继承于QOpenGLFunctions,相较于QOpenGLFunctions,额外提供了对OpenGL ES 3.0、3.1和3.2 API的跨平台访问,如果我们需要在类中使用opengl函数,只需要使类继承于QOpenGLExtraFunctions,就能在内部通过this指针访问到OpenGL函数
QOpenGLShaderProgram
QOpenGLShaderProgram是Qt中用于管理OpenGL着色器程序的类。它封装了OpenGL的着色器对象(Shader Object)和着色器程序对象(Shader Program Object),提供了一种方便的方式来管理和使用着色器。
标准化设备坐标(Normalized Device Coordinates, NDC)
顶点着色器中处理过后,就应该是标准化设备坐标了,x、y和z的值在-1.0到1.0的一小段空间(立方体)。落在范围外的坐标都会被裁剪。下面代码中顶点数据的坐标就是使用该坐标。
源码
CMakeLists.txt
cmake_minimum_required(VERSION 3.5)project(Day01 VERSION 0.1 LANGUAGES CXX)set(CMAKE_AUTOUIC ON)
set(CMAKE_AUTOMOC ON)
set(CMAKE_AUTORCC ON)set(CMAKE_CXX_STANDARD 17)
set(CMAKE_CXX_STANDARD_REQUIRED ON)// 注意添加OpenGL模块
find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Widgets OpenGL)
find_package(Qt${QT_VERSION_MAJOR} REQUIRED COMPONENTS Widgets OpenGL)set(PROJECT_SOURCESmain.cppwidget.cppwidget.h
)add_executable(Day01${PROJECT_SOURCES}shader.qrc
)target_link_libraries(Day01 PRIVATEQt${QT_VERSION_MAJOR}::WidgetsQt${QT_VERSION_MAJOR}::OpenGL
)
widget.h
#ifndef WIDGET_H
#define WIDGET_H#include <QOpenGLWidget>
#include <QOpenGLExtraFunctions>
#include <QOpenGLShaderProgram>/*** 绘制窗口*/
class Widget : public QOpenGLWidget, protected QOpenGLExtraFunctions
{Q_OBJECTpublic:Widget(QWidget *parent = nullptr);~Widget();protected:void initializeGL() override;void resizeGL(int w, int h) override;void paintGL() override;private:QOpenGLShaderProgram shaderProgram;
};
#endif // WIDGET_H
widget.cpp
#include "widget.h"Widget::Widget(QWidget *parent): QOpenGLWidget(parent)
{
}Widget::~Widget()
{
}void Widget::initializeGL()
{initializeOpenGLFunctions();glClearColor(0.0f, 0.0f, 0.0f, 1.0f);glClear(GL_COLOR_BUFFER_BIT);shaderProgram.create();shaderProgram.addShaderFromSourceFile(QOpenGLShader::Vertex, ":/gl.vert");shaderProgram.addShaderFromSourceFile(QOpenGLShader::Fragment, ":/gl.frag");shaderProgram.link();// 开启着色器程序的pos属性shaderProgram.enableAttributeArray("pos");
}void Widget::resizeGL(int w, int h)
{glViewport(0, 0, w, h);
}void Widget::paintGL()
{shaderProgram.bind();GLfloat vertices[] = {0.0f, 0.5f, 0.0f,0.5f, -0.5f, 0.0f,-0.5f, -0.5f, 0.0f,};// 设置顶点数据的数据来源,从vertices数组中读取,且每三个数据作为一个顶点数据(vec3)shaderProgram.setAttributeArray("pos", vertices, 3);glDrawArrays(GL_TRIANGLES, 0, 3);
}
gl.vert
in vec3 pos;void main(void)
{gl_Position = vec4(pos, 1.0);
}
gl.frag
void main(void)
{gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
}
结果展示:
在此我们就绘制成功啦!赶紧动手试试吧,不用太在意里面的细节,后面会更详细的讲解。