实验2.2——VAO,VBO的总结

这俩个O,前面搞了这么多链接,已经迷糊了,捋一捋吧。

事物的发展都是一个过程,所以如果能按着这个技术发展的过程来学习,应该就能捋顺了。

简单的说,如果能亲身经历一遍这个发展过程,重新”发明“出VAO+VBO,自然就明白啥是VAO,VBO了。

过程1——立即渲染模式

这里不从网上找概念,因为我是小白,找了也看不懂,直接弄一点感性认识就可以了,小白不能要求太高嘛……

好像这样的就是所谓的立即渲染模式

glBegin( GL_TRIANGLES );

    glVertex3f(-1.0f, -0.5f, -4.0f);

    glVertex3f( 1.0f, -0.5f, -4.0f);

    glVertex3f( 0.0f, 0.5f, -4.0f);

glEnd();

它是通过这些函数调用,来实现图形数据从CPU到GPU的传输的,这就存在两个问题。

  • 函数调用,需要压栈,弹栈什么的,很花时间
  • 数据传输需要时间,因为这些零件没有集成在一起。如下图(引用自这里)所示,CPU,GPU,内存,相互之间都是存在一定的距离的,虽然电信号传的快,但传输时间也不会是0.

过程2——使用VBO

天地万物之理,无独必有对。 问题能出现,就会有解决方法。

 这是那个曾经看过的浏览量很高的pyopengl的教程

从高亮的那句话,就能这么猜测一下——在历史上,是先出现的VBO,再出现的VAO+VBO

 引用自:

(31条消息) 写给 python 程序员的 OpenGL 教程_天元浪子的博客-CSDN博客_写给python程序员的opengl

调用函数传数据到GPU,很花时间,那末,直接把数据放到显存里,绘制的时候直接让GPU从显存里取,不就快了吗?

这个其实就是VBO。

这个链接里面有完整的代码,试了试,可以运行的:

(31条消息) OpenGL使用纯VBO方式渲染出三角形,非VAO_AppNinja的博客-CSDN博客_opengl vbo使用

 拿前面那个绘制彩色三角形的改了改,也实现了纯VBO——没用VAO,只搞了两个VBO,用来存这两个三角形的数据。

代码在这里

结果是这个: 

不用VAO好像也可以,就是写代码的时候麻烦了一点。

过程3——使用VAO管理VBO

在上一个过程中,是不是觉得这么写比较麻烦?

而且,这还只是2个图形,各2个属性的情况,多了只会更麻烦…… 

 那末,怎么办?——往上再封装一层。【封装,有计算机内味儿了】

VAO的诞生——VBO+封装 

网页1 

 这个链接,详细生动的说明了VAO到底是什么:

VAO(Vertex Array Object)简单理解其实代表的就是模型的数据,我们可能需要很多个模型,所以需要有个id来区分,所以创建vao的时候会返回一个vaoID。VAO中有一个属性列表,默认有16个属性(0 - 15),我们可以为属性指定数据,其中属性可以是顶点位置,颜色,法线,纹理坐标等等我们需要的数据,其中的每一个属性对应的数据其实就是VBO(vertex buffer object)。

OpenGL有两类函数,第一种是状态设置函数,第二种是状态使用函数。比如对于vao对象,glBindVertexArray(vaoID)函数就是状态设置函数,glVertexAttribPointer就是状态使用函数,用来为属性列表中的某个属性绑定数据,绑定的数据就是vbo,如果我们已经为vao绑定过数据了,下一次使用的时候就不需要重新绑定了,直接使用这个vao就可以了,相当于我们已经有模型的数据了。在bind和unbind(就是调用glBindVertexArray(0))之间的操作都是针对这一个vao对象的。形象的理解两者之间的关系可以看下图:

引用自:

vao和vbo - 知乎 (zhihu.com)

网页2 

 配合下面这个一起看,风味更佳:

 上面那个图,和下面这个图,连起来看,就知道具体的VAO是什么了,而不是抽象的VAO。

引用自:

(31条消息) [OpenGL] VAO、VBO、EBO_Zeehoy的博客-CSDN博客_opengl vbo

网页3 

关于上图中红色的VAO里的那个类似长度16索引为0--15的线性表数据结构,还可以再接着认识:

 里面的代码,试了试,是可以运行的


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


// 屏幕宽,高
int screen_width = 1280;
int screen_height = 720;

int main() {
    // 第一部分,初始化GLFW和GLAD,分为4个步骤进行/

    // 初始化GLFW
    glfwInit();                                                     // 初始化GLFW
    glfwWindowHint(GLFW_CONTEXT_VERSION_MAJOR, 3);                  // OpenGL版本为3.3,主次版本号均设为3
    glfwWindowHint(GLFW_CONTEXT_VERSION_MINOR, 3);
    glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);  // 使用核心模式(无需向后兼容性)
    //glfwWindowHint(GLFW_OPENGL_FORWARD_COMPAT, GL_TRUE);            // 如果使用的是Mac OS X系统,需加上这行
    glfwWindowHint(GLFW_RESIZABLE, false);						    // 不可改变窗口大小

    // 必须使用VAO渲染
    //glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE);
    // 渲染出纯VBO三角形
    glfwWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_COMPAT_PROFILE);

    // 创建窗口(宽、高、窗口名称)
    auto window = glfwCreateWindow(screen_width, screen_height, "Triangle", nullptr, nullptr);
    if (window == nullptr) {                                        // 如果窗口创建失败,输出Failed to Create OpenGL Context
        std::cout << "Failed to Create OpenGL Context" << std::endl;
        glfwTerminate();
        return -1;
    }
    glfwMakeContextCurrent(window);                                 // 将窗口的上下文设置为当前线程的主上下文

    // 初始化GLAD,加载OpenGL函数指针地址的函数
    // 在调用任何OpenGL函数之前
    if (!gladLoadGLLoader((GLADloadproc)glfwGetProcAddress))
    {
        std::cout << "Failed to initialize GLAD" << std::endl;
        return -1;
    }

    // 指定当前视口尺寸(前两个参数为左下角位置,后两个参数是渲染窗口宽、高)
    glViewport(0, 0, screen_width, screen_height);

    //查询硬件支持的顶点属性的上限
    int nrAttributes;
    glGetIntegerv(GL_MAX_VERTEX_ATTRIBS, &nrAttributes);
    std::cout << "Maximum nr of vertex attributes supported: " << nrAttributes << std::endl;

 
    return 0;
}

运行结果

明白了,3060移动端VAO支持16种顶点属性。

这就是解释了为什么上面那个图,线性表的长度画的是16,而不是15或者17或者别的什么东西。

 引用自:

(31条消息) OPENGL学习笔记之glEnableVertexAttribArray函数_Sean_gGo的博客-CSDN博客_glenablevertexattribarray

网页4 

这个链接,可以当成一个总结来看:

一个VAO对应一个物体,一个VBO对应一个物品的所有属性 (顶点坐标、颜色等,除顶点索引外),而一个EBO仅对应一个物品的一种属性(顶点索引属性)。

 关于VAO的使用与否,这里又见到了。

还是以具体代码形式的,挺好的。

  • 只是用VBO,需要重复设置属性指针
  • VAO+VBO,可以少写点代码,一句就画出了2个三角形。【与下面的那个”渲染的代码“是呼应的】

引用自:

(31条消息) OpenGL中VAO、VBO和EBO的区别_码农高射炮的博客-CSDN博客_vao vbo区别

网页5

这个链接,关于VAO和VBO的每个函数,都画了图来解释,图很漂亮,文字也很详细,是一个不错的总结,适合我这样的0基础小白,从0开始建立一个感性认识,快速了解这些抽象的BO函数。

就是这里没给渲染的代码:

 但是问题不大,因为网页4里有,可以互补着看。

这个”渲染的代码“,大概就是gldrawarray什么的。

引用自:

(31条消息) [OpenGL] VAO、VBO、EBO_Zeehoy的博客-CSDN博客_opengl vbo

网页6

 《渲染的代码》

最早我是在这个链接里见到VAO下如何通过代码来绘制图形,复用的。

引用自:

(31条消息) 详解Opengl中VBO和VAO_代码乐的博客-CSDN博客_opengl vbo

其它

 还有更猛的,多个VAO与多个VBO

(31条消息) 多个着色器与多个VAO,VBO绘制三角形_LV小猪精的博客-CSDN博客_多个vbo

小白,暂时学不了那末多,先算了吧……

实际操作

对VAO,VBO有了更深一点的了解。

同时也认识到了,你这里面的,《一个VAO,两个VBO,两个三角形》,的那个最终运行成功的代码,VAO了个寂寞……

昨天写的认为是对的代码,今天可能就认为不对了。

反者道之动,事物总是在不断走向反面的过程里发展,也没毛病。

改!

改了的代码在这里

运行结果还是这个,但是代码已经变了。

这个是之前渲染部分的代码:

 这个是改了的代码:

简洁了一些,更像是一个心智健全的人写的代码了。

这个可能就算是一种进步吧。 

  • 7
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值