相关文章链接
C++ OpenGL学习笔记（1、Hello World空窗口程序）
目录
- 绘制橙色三角形绘制
- 1、主要修改内容有：
- 1.1、在主程序的基础上增加如下3个函数
- 1.2、另外在主程序外面新增3个全局变量
- 1.3、编写两个shader程序文件
- 2、initModel()函数
- 3、initShader函数
- 3.1、vertexShader.glsl文件
- 3.2、fragmentShader.glsl文件
- 3.3、initShader函数代码
- 3、rend函数
- 绿色随时间变化的三角形绘制
- 1.1、fragmentShader.glsl文件修改如下
- 1.2、在rend函数修改如下
- 总代码
- 1、mainl.cpp
- 2、vertexShader.glsl
- 3、fragmentShader.glsl
三角形是最基础的一个面图形，要在一个空的窗口上绘制三角形，就需要在上一节代码基础上进行修改。
绘制橙色三角形绘制
绘制效果
1、主要修改内容有：
1.1、在主程序的基础上增加如下3个函数
1.2、另外在主程序外面新增3个全局变量
如下
1.3、编写两个shader程序文件
vertexShader.glsl文件、fragmentShader.glsl文件
下面一项项的说代码
2、initModel()函数
该函数主要初始化模型，主要是初始化三角形顶点数据，初始化全局变量VAO、VBO
该函数内部流程大概：
0、初始化顶点数组，该数组总共3行，每行都是一个顶点数据，分别表示该点的x、y、z坐标点，所以总共是3个点的数据。
1、创建一个VAO
2、绑定VAO，
3、创建一个VBO，
4、绑定VBO，
5、给VBO分配显存空间，传输数据
6、告诉shader数据解析方式
7、激活锚点
8、给VBO解绑
9、给VAO解绑
该函数完整代码如下
void initModel()
{//构建模型，在模型数据发送GPU，VAO,VBO 在这里完成的
//基础数据，三角形顶点
float vertices[] = {
-0.5f,-0.5f,0.0f,
0.5,-0.5,0.0f,
0.0f,0.5f,0.0f
};
glGenVertexArrays(1, &VAO);//创建1个VAO
glBindVertexArray(VAO);//绑定VAO
//下面初始化VBO，下面的VBO就属于VAO的管理范围，以后绘图直接使用VAO即可
glGenBuffers(1, &VBO);//可以同时获取多个VBO的index
glBindBuffer(GL_ARRAY_BUFFER,VBO);//绑定VBO
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices,GL_STATIC_DRAW);//给GL_ARRAY_BUFFER分配空间，第二个参数：分配多大的空间，第三个参数：从哪里开始读取数据，第四个参数：告诉openGL怎么使用这个数据
//下面做锚定点
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);//每个顶点包含3个坐标，每个坐标都是float类型，不进行正则化，步长3 * sizeof(float)
glEnableVertexAttribArray(0);//激活0号锚点
glBindBuffer(GL_ARRAY_BUFFER, 0);//给VBO解绑
glBindVertexArray(0);//给VAO解绑
}
3、initShader函数
该函数完整形式：void initShader(const char* _vertexPath ,const char* _fragPath )；里面两个参数分别是两个shader文件的绝对路径，那么就先把两个shader文件摆出来吧
3.1、vertexShader.glsl文件
该文件为顶点数据处理文件，主要确定顶点位置。代码如下
#version 330 core //版本声明
layout(location = 0) in vec3 aPos;//记得上面在初始化模型里面激活0号锚点的代码吗，这是相对应的
void main()
{
//gl_Position 是opengl内置全局变量，该变量会在后面进行调用
gl_Position = vec4(aPos.x,aPos.y,aPos.z,1.0);
};
里面代码跟普通代码C++代码很相似，每行作用都做了注解，先照抄即可；
3.2、fragmentShader.glsl文件
该文件主要是光栅化显示作用，主要是对顶点数据进行内插，内插后在范围内的进行用指定颜色进行显示出来。
完整代码如下：
#version 330 core
out vec4 FragColor;//任何out定义的变量会被输出到下一步,openGL光栅化的下一步不用管，它是有个管线自动处理的
void main()
{
FragColor = vec4(1.0f, 0.5f, 0.2f, 1.0f);//1是白色，0是黑色。橙色RGB为：（1，0.5，0.2）最后一个是alpha通道，默认为1
};
注意这里出现了out定义的变量，数据类型是vec4，在shader语言中还有用in、uniform进行定义变量，数据类型可以自定义。区别是：
in定义的变量是由openGL管线中上一步传入过来的，上一步的out变量是下一步的in变量，变量名称不要变化；
uniform定义的变量是由外部C++代码传入进来的，后面可以做一个样例出来，现在先不用管；
管线搞不懂就看下面这张图：
管线顾名思义就是一根像线的管道，在这个管道中只有几个步骤可以进行编辑（填充蓝色的），其他步骤不需要程序员去管的（填充灰色的）：
3.3、initShader函数代码
该代码看着比较长，里面实际上只干了几件事情，最终是将shader代码编译链接在全局变量shaderProgram中。
函数流程：
1、读取_vertexPath （vertexShader.glsl）文件到变量_vertexCode中；
2、读取_fragPath （fragmentShader.glsl）文件到变量 _fragCode中；
3、分别编译_vertexCode、 _fragCode代码到_vertexID、_fragID；
4、初始化全局变量shaderProgram，分别将刚刚编译出来的_vertexID、_fragID链接到shaderProgram里面去；
5、分别检查编译是否成功、链接是否成功，最后进行_vertexID、_fragID的释放
void initShader(const char* _vertexPath ,const char* _fragPath )
{//shader写出来，编译出来
std::string _vertexCode("");
std::string _fragCode("");
std::ifstream _vShaderFile;
std::ifstream _fShaderFile;
_vShaderFile.exceptions(std::ifstream::failbit| std::ifstream::badbit);
_fShaderFile.exceptions(std::ifstream::failbit| std::ifstream::badbit);
try {
_vShaderFile.open(_vertexPath);
_fShaderFile.open(_fragPath);
std::stringstream _vShaderStream, _fShaderStream;
_vShaderStream << _vShaderFile.rdbuf();
_fShaderStream << _fShaderFile.rdbuf();
_vertexCode = _vShaderStream.str();
_fragCode = _fShaderStream.str();
}
catch (std::ifstream::failure e) {
std::string errStr = "rerad shader fail";
std::cout << errStr << std::endl;
}
const char* _vShaderStr = _vertexCode.c_str();
const char* _fShaderStr = _fragCode.c_str();
//shader的编译链接
unsigned int _vertexID = 0,_fragID = 0;
char _infoLog[512];//存储错误信息
int _successFlag = 0;//是否成功
//编译
_vertexID = glCreateShader(GL_VERTEX_SHADER);//编译的是VERTEX类型
glShaderSource(_vertexID, 1, &_vShaderStr, NULL);//把代码传过去
glCompileShader(_vertexID);//编译
glGetShaderiv(_vertexID,GL_COMPILE_STATUS,&_successFlag);//获取编译情况如何
if (!_successFlag) {
//如果编译不成功
glGetShaderInfoLog(_vertexID, 512,NULL,_infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//frag shader
_fragID = glCreateShader(GL_FRAGMENT_SHADER);//编译的是FRAGMENT类型
glShaderSource(_fragID, 1, &_fShaderStr, NULL);//把代码传过去
glCompileShader(_fragID);//编译
glGetShaderiv(_fragID, GL_COMPILE_STATUS, &_successFlag);//获取编译情况如何
if (!_successFlag) {
//如果编译不成功
glGetShaderInfoLog(_fragID, 512, NULL, _infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//链接
shaderProgram = glCreateProgram();
glAttachShader(shaderProgram,_vertexID);//向program好的加入编译好的
glAttachShader(shaderProgram,_fragID);//向program好的加入
glLinkProgram(shaderProgram);//开始链接
//检查链接是否成功
glGetProgramiv(shaderProgram, GL_LINK_STATUS, &_successFlag);
if (!_successFlag) {
//如果链接不成功
glGetProgramInfoLog(shaderProgram, 512, NULL, _infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//释放
glDeleteShader(_vertexID);
glDeleteShader(_fragID);
}
3、rend函数
该函数是绘制函数，是放在while循环里面的
void rend()
{//渲染函数
//每次循环都会调用该函数,直接进行渲染
glBindVertexArray(VAO);//使用VAO方式进行绘制
glUseProgram(shaderProgram);
glDrawArrays(GL_TRIANGLES,0,3);//绘制，从第0个开始画，起作用的是3个
glUseProgram(0);
}
编译运行的效果
绿色随时间变化的三角形绘制
该程序是在橙色三角形的基础上进行变种来的，程序逻辑是从外部传入一个随着时间变化的颜色数据即可。
主要修改：
1、fragmentShader.glsl文件中，新增一个uniform定义的颜色变量；
2、在rend函数中新增一个与时间相关的变换函数，该函数输出的值作为绿色波段的颜色值；将新增的绿色波段颜色信息传入到fragmentShader中即可
1.1、fragmentShader.glsl文件修改如下
//外部传参的写法
#version 330 core
out vec4 FragColor;
uniform vec4 MyColor;//通过外部传参进来
void main()
{
FragColor = MyColor;//外部传进来的颜色直接传到下一个流程中
};
1.2、在rend函数修改如下
void rend()
{//渲染函数
//外部传参的写法，将颜色通过外面传入进去===========================================
glUseProgram(shaderProgram);//注意这行代码必须提前，否则黑屏，绘制不出来
float _time = glfwGetTime();//获取时间，通过时间变换来改变渲染颜色；
float _green = sin(_time)*0.5f+0.5f;//动态改变绿色通道的值
int _location = glGetUniformLocation(shaderProgram,"MyColor");//获取MyColor变量位置，MyColor即fragmentShader.glsl文件中用uniform修饰的变量
glUniform4f(_location, 0.0f, _green, 0.0f, 1.0f);//把颜色传入进去（ 0.0f, _green, 0.0f, 1.0f）传入到fragmentShader里面的MyColor变量
glBindVertexArray(VAO);//使用VAO方式进行绘制
glDrawArrays(GL_TRIANGLES, 0, 3);//绘制，从第0个开始画，起作用的是3个
glUseProgram(0);
}
运行后，这窗口中三角形随着时间的变化不断循环颜色发生变化，如下图
总代码
总共代码在上次环境配置基础上，修改3个文件：
1、main.cpp
2、vertexShader.glsl
3、fragmentShader.glsl
1、mainl.cpp
/*
三角形绘制基础代码
在这节课介绍三角形绘制的基础方法，也会涉及到基础的shader调用，其中最关键的概念是
VAO、VBO在OpenGL核心模式下的使用及内涵
也会做一个小小的程序结构，让大家方便今后的架构慢慢改进
先对vertexShader.glsl 进行顶点变换,再传入fragmentShader.glsl里面插值
1、获取VBO的index
2、绑定VBO的index
3、给VBO分配显存空间，传输数据
4、告诉shader数据解析方式
5、激活锚点
*/
#include <glad/glad.h>
#include "GLFW/glfw3.h"
#include <iostream>
#include <string>
#include <fstream>
#include <sstream>
unsigned int VBO = 0;
unsigned int VAO = 0;
unsigned int shaderProgram = 0;
void rend()
{//渲染函数
每次循环都会调用该函数,直接进行渲染
//glBindVertexArray(VAO);//使用VAO方式进行绘制
//glUseProgram(shaderProgram);
//glDrawArrays(GL_TRIANGLES,0,3);//绘制，从第0个开始画，起作用的是3个
//glUseProgram(0);
//外部传参的写法，将颜色通过外面传入进去===========================================
glUseProgram(shaderProgram);
float _time = glfwGetTime();//获取时间，通过时间变换来改变渲染颜色；
float _green = sin(_time)*0.5f+0.5f;//动态改变绿色通道的值
int _location = glGetUniformLocation(shaderProgram,"MyColor");//获取MyColor变量位置
glUniform4f(_location, 0.0f, _green, 0.0f, 1.0f);//把颜色传入进去（ 0.0f, _green, 0.0f, 1.0f）传入到fragmentShader里面的MyColor变量
glBindVertexArray(VAO);//使用VAO方式进行绘制
glDrawArrays(GL_TRIANGLES, 0, 3);//绘制，从第0个开始画，起作用的是3个
glUseProgram(0);
}
void initModel()
{//构建模型，在模型数据发送GPU，VAO,VBO 在这里完成的
//基础数据，三角形顶点
float vertices[] = {
-0.5f,-0.5f,0.0f,
0.5,-0.5,0.0f,
0.0f,0.5f,0.0f
};
glGenVertexArrays(1, &VAO);//创建1个VAO
glBindVertexArray(VAO);//绑定VAO
//下面初始化VBO，下面的VBO就属于VAO的管理范围，以后绘图直接使用VAO即可
glGenBuffers(1, &VBO);//可以同时获取多个VBO的index
glBindBuffer(GL_ARRAY_BUFFER,VBO);//绑定VBO
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices,GL_STATIC_DRAW);//给GL_ARRAY_BUFFER分配空间，第二个参数：分配多大的空间，第三个参数：从哪里开始读取数据，第四个参数：告诉openGL怎么使用这个数据
//下面做锚定点
glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);//每个顶点包含3个坐标，每个坐标都是float类型，不进行正则化，步长3 * sizeof(float)
glEnableVertexAttribArray(0);//激活0号锚点
glBindBuffer(GL_ARRAY_BUFFER, 0);//给VBO解绑
glBindVertexArray(0);//给VAO解绑
}
void initShader(const char* _vertexPath ,const char* _fragPath )
{//shader写出来，编译出来
std::string _vertexCode("");
std::string _fragCode("");
std::ifstream _vShaderFile;
std::ifstream _fShaderFile;
_vShaderFile.exceptions(std::ifstream::failbit| std::ifstream::badbit);
_fShaderFile.exceptions(std::ifstream::failbit| std::ifstream::badbit);
try {
_vShaderFile.open(_vertexPath);
_fShaderFile.open(_fragPath);
std::stringstream _vShaderStream, _fShaderStream;
_vShaderStream << _vShaderFile.rdbuf();
_fShaderStream << _fShaderFile.rdbuf();
_vertexCode = _vShaderStream.str();
_fragCode = _fShaderStream.str();
}
catch (std::ifstream::failure e) {
std::string errStr = "rerad shader fail";
std::cout << errStr << std::endl;
}
const char* _vShaderStr = _vertexCode.c_str();
const char* _fShaderStr = _fragCode.c_str();
//shader的编译链接
unsigned int _vertexID = 0,_fragID = 0;
char _infoLog[512];//存储错误信息
int _successFlag = 0;//是否成功
//编译
_vertexID = glCreateShader(GL_VERTEX_SHADER);//编译的是VERTEX类型
glShaderSource(_vertexID, 1, &_vShaderStr, NULL);//把代码传过去
glCompileShader(_vertexID);//编译
glGetShaderiv(_vertexID,GL_COMPILE_STATUS,&_successFlag);//获取编译情况如何
if (!_successFlag) {
//如果编译不成功
glGetShaderInfoLog(_vertexID, 512,NULL,_infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//frag shader
_fragID = glCreateShader(GL_FRAGMENT_SHADER);//编译的是FRAGMENT类型
glShaderSource(_fragID, 1, &_fShaderStr, NULL);//把代码传过去
glCompileShader(_fragID);//编译
glGetShaderiv(_fragID, GL_COMPILE_STATUS, &_successFlag);//获取编译情况如何
if (!_successFlag) {
//如果编译不成功
glGetShaderInfoLog(_fragID, 512, NULL, _infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//链接
shaderProgram = glCreateProgram();
glAttachShader(shaderProgram,_vertexID);//向program好的加入编译好的
glAttachShader(shaderProgram,_fragID);//向program好的加入
glLinkProgram(shaderProgram);//开始链接
//检查链接是否成功
glGetProgramiv(shaderProgram, GL_LINK_STATUS, &_successFlag);
if (!_successFlag) {
//如果链接不成功
glGetProgramInfoLog(shaderProgram, 512, NULL, _infoLog);
std::string errStr(_infoLog);
std::cout << errStr << std::endl;
}
//释放
glDeleteShader(_vertexID);
glDeleteShader(_fragID);
}
void framebuffer_size_callback(GLFWwindow* window, int width, int height)
{
glViewport(0, 0, width, height);
}
void processInput(GLFWwindow *window)
{//检测是否有外部输入
if (glfwGetKey(window, GLFW_KEY_ESCAPE) == GLFW_PRESS)
{
glfwSetWindowShouldClose(window, true);//把关闭状态设置为true
}
}
int main()
{
glfwInit();//初始化上下文环境
glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);//要求opengl 3版本以上
glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);//设置CORE模式，只能用VAO绘制
GLFWwindow* window = glfwCreateWindow(800, 600, "OpenGL Core", NULL, NULL);//创建窗体
if (window == NULL)
{
std::cout << "Failed to create GLFW window" << std::endl;
glfwTerminate();
return -1;
}
glfwMakeContextCurrent(window);//上下文绑定窗体
if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))//初始化函数指针，为下面函数做准备
{
std::cout << "Failed to initialize GLAD" << std::endl;
return -1;
}
glViewport(0, 0, 800, 600);//设置需要渲染的视口
glfwSetFramebufferSizeCallback(window, framebuffer_size_callback);//设置回调函数
initModel();//初始化模型
initShader("vertexShader.glsl","fragmentShader.glsl");//初始化shader文件
while (!glfwWindowShouldClose(window))//创建的window关掉后就退出while循环
{
processInput(window);//
glClearColor(0.2f, 0.3f, 0.3f, 1.0f);//设置颜色
glClear(GL_COLOR_BUFFER_BIT);//用设置的颜色把画布进行清零掉
rend();//渲染绘制
glfwSwapBuffers(window);
glfwPollEvents();
}
glfwTerminate();
std::cout << "Hello World!\n";
return 0;
}
2、vertexShader.glsl
#version 330 core
layout(location = 0) in vec3 aPos;
void main()
{
//gl_Position 是opengl内置全局变量，该变量会在后面进行调用
gl_Position = vec4(aPos.x,aPos.y,aPos.z,1.0);
};
3、fragmentShader.glsl
/*任何out定义的变量会被输出到下一步*/
//#version 330 core
//out vec4 FragColor;
//void main()
//{
// FragColor = vec4(1.0f, 0.5f, 0.2f, 1.0f);
//
//};
//外部传参的写法
#version 330 core
out vec4 FragColor;
uniform vec4 MyColor;//通过外部传参进来
void main()
{
FragColor = MyColor;//外部传进来的颜色直接传到下一个流程中
};
