四、OpenGL中VBO与VAO的使用及本质

TechNomad

已于 2025-03-13 11:39:58 修改

阅读量1k

点赞数 21

分类专栏： OpenGL教程文章标签： OpenGL C++

于 2025-03-09 17:36:49 首次发布

本文链接：https://blog.youkuaiyun.com/TechNomad/article/details/146130030

版权

OpenGL教程专栏收录该内容

7 篇文章

订阅专栏

文章目录

一、什么是VBO

在OpenGL中，顶点缓冲对象（Vertex Buffer Object，简称VBO）是一种用于将顶点数据（如位置、法线、颜色等）上传到视频设备以进行非立即模式渲染的功能。与立即模式渲染相比，VBO提供了显著的性能提升，主要原因是数据驻留在视频设备内存中，而非系统内存，因此可以直接由视频设备渲染。

VBO的作用：

性能提升：通过将顶点数据存储在显卡内存中，减少了每次渲染时从系统内存传输数据的开销，提高了渲染效率。
内存管理：将大量的顶点数据存储在显卡内存中，有助于优化内存使用，特别是在处理复杂场景时。

二、VBO的使用步骤

1.生成缓冲对象
使用glGenBuffers函数创建一个新的VBO，并返回其ID。

GLuint vbo;
glGenBuffers(1, &vbo);

2.绑定缓冲对象
使用glBindBuffer函数将创建的VBO绑定为当前的顶点缓冲对象。

glBindBuffer(GL_ARRAY_BUFFER, vbo);

3.上传数据
使用glBufferData函数将顶点数据上传到显卡内存。

float vertices[] = {
    // 顶点数据，例如三角形的三个顶点
    0.0f,  1.0f, 0.0f,
   -1.0f, -1.0f, 0.0f,
    1.0f, -1.0f, 0.0f
};

//GL_STATIC_DRAW 表示数据不会频繁更改。
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

4.设置顶点属性指针
使用glVertexAttribPointer函数指定顶点属性的布局。

glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
glEnableVertexAttribArray(0);

0 是顶点属性的位置。
3 表示每个顶点有 3 个分量（x, y, z）。
GL_FLOAT 指定数据类型。
GL_FALSE 表示不标准化数据。
3 * sizeof(GLfloat) 是步长。
(GLvoid*)0 是起始偏移量。

5.解绑 VBO

glBindBuffer(GL_ARRAY_BUFFER, 0);

6.绘制图元
使用glDrawArrays或glDrawElements函数进行绘制。

glDrawArrays(GL_TRIANGLES, 0, 3);

7.删除缓冲对象
在不再需要时，使用glDeleteBuffers函数删除VBO以释放资源。

glDeleteBuffers(1, &vbo);

三、VBO使用的完整示例

#include "glad/glad.h"
#include "GLFW/glfw3.h"

int main() {
	// 初始化 GLFW 和 GLEW
	glfwInit();
	GLFWwindow* window = glfwCreateWindow(800, 600, "VBO Example", NULL, NULL);
	glfwMakeContextCurrent(window);
	//glewInit();

	// 顶点数据
	GLfloat vertices[] = {
		-0.5f, -0.5f, 0.0f,
		 0.5f, -0.5f, 0.0f,
		 0.0f,  0.5f, 0.0f
	};

	// 创建并绑定 VBO
	GLuint VBO;
	glGenBuffers(1, &VBO);
	glBindBuffer(GL_ARRAY_BUFFER, VBO);
	glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

	// 配置顶点属性指针
	glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);
	glEnableVertexAttribArray(0);

	// 解绑 VBO
	glBindBuffer(GL_ARRAY_BUFFER, 0);

	// 渲染循环
	while (!glfwWindowShouldClose(window)) {
		// 清除屏幕
		glClear(GL_COLOR_BUFFER_BIT);

		// 绑定 VBO 并绘制
        glBindBuffer(GL_ARRAY_BUFFER, VBO);
		glDrawArrays(GL_TRIANGLES, 0, 3);
		 
		// 交换缓冲区
		glfwSwapBuffers(window);
		glfwPollEvents();
	}

	// 删除 VBO
	glDeleteBuffers(1, &VBO);

	// 清理
	glfwTerminate();
	return 0;
}

四、什么是VAO

在OpenGL中，顶点数组对象（Vertex Array Object，简称VAO）是一种用于管理顶点属性状态的对象。它能够存储与顶点属性相关的配置，如顶点缓冲对象（VBO）的绑定状态、顶点属性指针的设置等。通过使用VAO，可以简化绘制过程，因为只需绑定相应的VAO，OpenGL就会自动恢复之前的设置。

VAO 的作用：

简化配置：将顶点属性配置（如 VBO 绑定、顶点属性指针）存储在 VAO 中，避免每次绘制时重复设置。
提高效率：通过绑定 VAO 快速切换顶点配置，减少 OpenGL 状态切换的开销。
支持复杂场景：在需要多个 VBO 或不同顶点配置的场景中，VAO 提供了更高效的管理方式。

VAO 与 VBO 的关系：

VBO：存储实际的顶点数据（如顶点坐标、颜色、法线等）。
VAO：存储顶点属性的配置（如 VBO 绑定、顶点属性指针等）。

VAO 并不存储顶点数据本身，而是存储如何从 VBO 中读取顶点数据的配置。绑定 VAO 后，OpenGL 会自动使用 VAO 中存储的配置来读取 VBO 中的数据。

五、VAO的使用步骤

1.生成VAO
使用glGenVertexArrays函数创建一个新的VAO，并返回其ID。

GLuint VAO;
glGenVertexArrays(1, &VAO);

2.绑定VAO
使用glBindVertexArray函数将创建的VAO绑定为当前的顶点数组对象。绑定 VAO 后，所有后续的顶点属性配置（如 VBO 绑定、顶点属性指针设置）都会存储在这个 VAO 中。

glBindVertexArray(VAO);

3.生成并绑定VBO

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

GLuint VBO;
glGenBuffers(1, &VBO);
glBindBuffer(GL_ARRAY_BUFFER, VBO);
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

4.配置顶点属性指针

glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(GLfloat), (GLvoid*)0);
glEnableVertexAttribArray(0);

5.解绑VAO和VBO
为了避免意外修改，解绑VAO和VBO。

glBindBuffer(GL_ARRAY_BUFFER, 0);
glBindVertexArray(0);

6.绘制物体
在渲染循环中，绑定VAO并调用绘制函数。

glBindVertexArray(VAO);
glDrawArrays(GL_TRIANGLES, 0, 3);
glBindVertexArray(0);

7.删除VAO和VBO
在程序结束时，删除VAO和VBO以释放资源。

glDeleteVertexArrays(1, &VAO);
glDeleteBuffers(1, &VBO);

六、VAO使用的完整示例

在 OpenGL 中，GLSL（OpenGL Shading Language）文件通常用于存储顶点着色器（Vertex Shader）、片元着色器（Fragment Shader）等着色器程序。

1. 创建 GLSL 文件
GLSL 代码通常存储在 .vert（顶点着色器）或 .frag（片元着色器）文件中，例如：

vertex_shader.vert

#version 330 core
layout (location = 0) in vec3 aPos;

void main()
{
    gl_Position = vec4(aPos, 1.0);
}

fragment_shader.frag

#version 330 core
out vec4 FragColor;

void main()
{
    FragColor = vec4(1.0, 0.5, 0.2, 1.0);
}

2. GLSL 文件添加到项目中
在这里插入图片描述
3. 读取 GLSL 文件

#include <iostream>
#include <fstream>
#include <sstream>
#include <string>

std::string readShaderFile(const char* filePath) {
    std::ifstream shaderFile(filePath);
    if (!shaderFile.is_open()) {
        std::cerr << "无法打开 GLSL 文件: " << filePath << std::endl;
        return "";
    }
    
    std::stringstream shaderStream;
    shaderStream << shaderFile.rdbuf();
    return shaderStream.str();
}

以下是一个使用 VAO 和 VBO读取GLSL文件的完整示例：

#include <iostream>
#include <string>
#include <fstream>
#include <sstream>
#include "glad/glad.h"
#include "GLFW/glfw3.h"

GLuint VBO = 0;
GLuint VAO = 0;
GLuint shaderProgram = 0;

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);
	}
}

void rend() {
	glBindVertexArray(VAO);
	glUseProgram(shaderProgram);
	glDrawArrays(GL_TRIANGLES, 0, 3);
	glBindVertexArray(0);
	glUseProgram(0);
}

void initModel() {
	float vertices[] = {
		-0.5f, -0.5f, 0.0f,
		0.5f, -0.5f, 0.0f,
		0.0f, 0.5f, 0.0f
	};

	glGenVertexArrays(1, &VAO);
	glBindVertexArray(VAO);

	glGenBuffers(1, &VBO); //获取vbo的index
	glBindBuffer(GL_ARRAY_BUFFER, VBO); //绑定vbo的index，给vbo分配显存空间，传输数据
	//告诉shader数据解析格式
	glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW); 
	glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0); //激活锚点
	glEnableVertexAttribArray(0);
	glBindBuffer(GL_ARRAY_BUFFER, 0);
	glBindVertexArray(0);
}

void initShader(const char* _vertexPath, const char* _fragmPath) {
	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(_fragmPath);

		std::stringstream _vShaderStream, _fShaderStream;
		_vShaderStream << _vShaderFile.rdbuf();
		_fShaderStream << _fShaderFile.rdbuf();

		_vertexCode = _vShaderStream.str();
		_fragCode = _fShaderStream.str();
	} catch (const std::exception&) {
		std::string errStr = "read 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 _inforLog[512] = { 0 };
	int _successFlag = 0;

	
	//编译
	_vertexID = glCreateShader(GL_VERTEX_SHADER);
	glShaderSource(_vertexID, 1, &_vShaderStr, NULL);
	glCompileShader(_vertexID);

	glGetShaderiv(_vertexID, GL_COMPILE_STATUS, &_successFlag);
	if (_successFlag) {
		glGetShaderInfoLog(_vertexID, 512, NULL, _inforLog);
		std::string errstr(_inforLog);
		std::cout << _inforLog << std::endl;
	}

	_fragID = glCreateShader(GL_FRAGMENT_SHADER);
	glShaderSource(_fragID, 1, &_fShaderStr, NULL);
	glCompileShader(_fragID);

	glGetShaderiv(_fragID, GL_COMPILE_STATUS, &_successFlag);
	if (_successFlag) {
		glGetShaderInfoLog(_vertexID, 512, NULL, _inforLog);
		std::string errstr(_inforLog);
		std::cout << _inforLog << std::endl;
	}

	//链接
	shaderProgram = glCreateProgram();
	glAttachShader(shaderProgram, _vertexID);
	glAttachShader(shaderProgram, _fragID);
	glLinkProgram(shaderProgram);

	glGetProgramiv(shaderProgram, GL_LINK_STATUS, &_successFlag);
	if (!_successFlag) {
		glGetProgramInfoLog(shaderProgram, 512, NULL, _inforLog);
		std::string errStr(_inforLog);
		std::cout << _inforLog << std::endl;
	}
	glDeleteShader(_vertexID);
	glDeleteShader(_fragID);
}

int main() {
	glfwInit();
	glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);
	glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
	glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);

	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("vertex_shader.vert", "fragment_shader.frag");

	while (!glfwWindowShouldClose(window)) {
		processInput(window);

		glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
		glClear(GL_COLOR_BUFFER_BIT);

		rend();

		glfwSwapBuffers(window);
		glfwPollEvents();
	}

	// 删除 VAO 和 VBO
	glDeleteVertexArrays(1, &VAO);
	glDeleteBuffers(1, &VBO);

	// 清理
	glfwTerminate();
	
	return 0;
}

输出结果：
在这里插入图片描述