首页 > 其他分享 >实验2.2——VAO,VBO的总结

实验2.2——VAO,VBO的总结

时间:2023-03-12 22:47:08浏览次数:59  
标签:VAO OpenGL 代码 VBO 博客 GLFW 2.2

这俩个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了个寂寞……

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

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

改!

改了的代码在这里

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

 

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

 这个是改了的代码:

 

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

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

 

https://blog.csdn.net/averagePerson/article/details/125632986

标签:VAO,OpenGL,代码,VBO,博客,GLFW,2.2
From: https://www.cnblogs.com/im18620660608/p/17209436.html

相关文章

  • µTorrent 2.2.1 build 25273下载
    来源:http://about.empornium.sx/ µTorrentRecommendedversionis2.2.1, newerversionsareknowntocontainvulnerabilities.Youmustensurethat"net.dis......
  • Nacos2.2.0安装启动报错
    安装Nacos2.2.0版本后,通过单机模式启动,startup.cmd-mstandalone,报如下错误:2023-03-1108:29:58,627ERRORApplicationrunfailedorg.springframework.beans.facto......
  • 数据挖掘(2.2)--数据预处理
    目录​​二、数据描述​​​​1.描述数据中心趋势​​​​1.1平均值和截断均值 ​​​​1.2加权平均值​​​​1.3中位数(Median)和众数(Mode)​​​​2.描述数据的分散程度......
  • 界面组件DevExpress WinForms v22.2 - 升级对HTML & CSS的支持
    DevExpressWinForms拥有180+组件和UI库,能为WindowsForms平台创建具有影响力的业务解决方案。DevExpressWinForms能完美构建流畅、美观且易于使用的应用程序,无论是Office......
  • VS插件CodeRush全新发布v22.2.4——改进对VS 17.5的支持
    CodeRush是一个强大的VisualStudio®.NET插件,它利用整合技术,通过促进开发者和团队效率来提升开发者体验。CodeRush能帮助你以极高的效率创建和维护源代码。Consume-firs......
  • ENGG1310 P2.2 Data, Logic Gates & Binary Computation
    课程内容笔记,自用,不涉及任何assignment,exam答案Notesforself-use,donotincludeanyassignmentsorexamsDataRepresentations这里可以和前面介绍的数字信号/......
  • 上周热点回顾(2.27-3.5)
    热点随笔:· 一键接入ChatGPT,让你的QQ群变得热闹起来 (极客飞兔)· 我的十年编程路2013年篇 (萧文翰)· 2023年,消失的金三银四 (peida)· 我做的FFmpeg开源C#封装......
  • 2023.02.21 模拟赛小结
    2023.02.21模拟赛小结目录2023.02.21模拟赛小结更好的阅读体验戳此进入赛时思路T1CodeT2CodeT3CodeT4Code正解T1CodeT2CodeT3T4UPD更好的阅读体验戳此进入赛时思路T1......
  • 杂题小记(2023.02.22)
    杂题小记(2023.02.22)目录杂题小记(2023.02.22)更好的阅读体验戳此进入HDU-3038HowManyAnswersAreWrong题面SolutionCodeLG-P1525[NOIP2010提高组]关押罪犯题面Soluti......
  • 杂题小记(2023.02.24)
    杂题小记(2023.02.24)目录杂题小记(2023.02.24)更好的阅读体验戳此进入LG-P5251[LnOI2019]第二代图灵机题面SolutionCodeLG-P3765总统选举题面SolutionCodeUPD更好的阅读体......