实现3D引擎（七）- VAO & VBO & EBO

野性酷女 2024-04-17 19:45 64阅读 0赞

本文将实现VAO同时绑定多个VBO中的数据。

关系如下：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70][]

代码示例

#include<iostream>
    #define GLEW_STATIC
    #include<GL/glew.h>
    #include<GLFW/glfw3.h>
    
    const char* vertexShaderSource =
    "#version 330 core                     \n"
    "layout(location = 0) in vec3 positionNew; \n"
    "layout(location = 1) in vec3 position; \n"
    "layout(location = 2) in vec3 color; \n"
    "out vec3 vertexColor;                     \n"
    "void main() {                          \n"
    "        vertexColor  = color;     \n"
    "		gl_Position = vec4(positionNew, 1.0); } \n ";
    
    
    const char* fragmentShaderSource =
    "#version 330 core             \n"
    "in vec3 vertexColor;          \n"
    "out vec4 fragColor;           \n"
    "void main(){                  \n"
    "	fragColor = vec4(vertexColor, 1.0f);}  \n";
    
    
    GLfloat verticesNew[] = {
        0.0f, 0.0f, 0.0f, 
        1.0f, 0.0f, 0.0f, 
        1.0f, 1.0f, 0.0f, 	  
        0.0f, 1.0f, 0.0f
    };
    
    float vertices[] = {
        // positions          // colors          
         0.5f,  0.5f, 0.0f,   1.0f, 0.0f, 0.0f,  
         0.5f, -0.5f, 0.0f,   0.0f, 1.0f, 0.0f,  
        -0.5f, -0.5f, 0.0f,   0.0f, 0.0f, 1.0f,  
        -0.5f,  0.5f, 0.0f,   1.0f, 1.0f, 0.0f  
    };
    
    unsigned int indices[] = {
        0, 1, 3, // first triangle
        1, 2, 3  // second triangle
    };
    
    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 Game", NULL, NULL); //创建窗口
        if (window == NULL)
        {
            std::cout << "Open window failed!" << std::endl;
            glfwTerminate();
            return -1;
        }
        //将窗口的上下文设置为当前线程的主上下文
        glfwMakeContextCurrent(window);
    
        //GLEW是用来管理OpenGL的函数指针,调用任何OpenGL的函数之前都需要初始化GLEW
        glewExperimental = GL_TRUE;
        if (glewInit() != GLEW_OK)
        {
            std::cout << "Init Glew failed！" << std::endl;
            glfwTerminate();
            return -1;
        }
    
        int width, height;
        //从GLFW中获取视口大小
        glfwGetFramebufferSize(window, &width, &height);
        //窗口左下角的位置、宽度、高度
        glViewport(0, 0, width, height);
    
        //顶点数组对象
        unsigned int VAO;
        glGenVertexArrays(1, &VAO);
        glBindVertexArray(VAO);
    
        //索引缓冲对象
        unsigned int EBO;
        glGenBuffers(1, &EBO);
        glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
        glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
    
        //顶点缓冲对象
        unsigned int VBO[2];
        glGenBuffers(2, VBO);
    
        glBindBuffer(GL_ARRAY_BUFFER, VBO[0]);
        //将顶点数据复制到缓冲中
        glBufferData(GL_ARRAY_BUFFER, sizeof(verticesNew), verticesNew, GL_STATIC_DRAW);
       // glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
          glBufferData(GL_ELEMENT_ARRAY_BUFFER, sizeof(indices), indices, GL_STATIC_DRAW);
        //顶点属性配置,告诉OpenGL该如何解析顶点数据
        glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 3 * sizeof(float), (void*)0);
        glEnableVertexAttribArray(0);
    
        glBindBuffer(GL_ARRAY_BUFFER, VBO[1]);
        //将顶点数据复制到缓冲中
        glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);
        //顶点属性配置,告诉OpenGL该如何解析顶点数据
        glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);
        glEnableVertexAttribArray(1);
        glVertexAttribPointer(2, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));
        glEnableVertexAttribArray(2);
    
        //创建顶点着色器
        unsigned int vertexShader = glCreateShader(GL_VERTEX_SHADER);
        glShaderSource(vertexShader, 1, &vertexShaderSource, NULL);
        glCompileShader(vertexShader);
    
        //创建片段着色器
        unsigned int fragmentShader = glCreateShader(GL_FRAGMENT_SHADER);
        glShaderSource(fragmentShader, 1, &fragmentShaderSource, NULL);
        glCompileShader(fragmentShader);
    
        //创建着色器程序
        unsigned int shaderProgram = glCreateProgram();
        glAttachShader(shaderProgram, vertexShader);
        glAttachShader(shaderProgram, fragmentShader);
        glLinkProgram(shaderProgram);
    
        //检查GLFW是否要求退出
        while (!glfwWindowShouldClose(window))
        {
            //检查是否触发事件（鼠标移动、键盘输入等），如果有则调用相应的回调函数
            glfwPollEvents();
            //渲染操作放入循环中
            //清屏
            glClearColor(0.2f, 0.3f, 0.3f, 1.0);
            glClear(GL_COLOR_BUFFER_BIT);
    
            glBindVertexArray(VAO);
            glBindBuffer(GL_ELEMENT_ARRAY_BUFFER, EBO);
            //启用着色器程序
            glUseProgram(shaderProgram);
            //绘制
            glDrawElements(GL_TRIANGLES, 6, GL_UNSIGNED_INT, 0);
            //glDrawArrays(GL_TRIANGLES, 0, 6);
            //交换颜色缓冲
            glfwSwapBuffers(window);
        }
        //结束时释放资源
        glfwTerminate();
        return 0;
    }

运行结果

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70 1][]

此时绘制的是VBO0中的顶点数据和VBO1中颜色数据。

想要绘制VBO1中的顶点数据和颜色数据，将顶点着色器中的代码

gl_Position = vec4(positionNew, 1.0);

修改为

gl_Position = vec4(position, 1.0);

运行结果

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70 2][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/e810dbb7f2fb46eda7f3f23fddab9926.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/130ce791c69443218ab6f6a494953911.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpeWF6aGVuMjAxMQ_size_16_color_FFFFFF_t_70 2]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/17/7a8e2c9dec454c33929be37b059a18ff.png