{"id":437,"date":"2025-02-07T23:21:34","date_gmt":"2025-02-07T15:21:34","guid":{"rendered":"https:\/\/trantor.ink\/?p=437"},"modified":"2025-02-07T23:21:35","modified_gmt":"2025-02-07T15:21:35","slug":"opengl-%e4%b8%ad-vao-%e7%9a%84%e6%a6%82%e5%bf%b5","status":"publish","type":"post","link":"https:\/\/trantor.ink\/?p=437","title":{"rendered":"OpenGL \u4e2d VAO \u7684\u6982\u5ff5"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>1. \u9876\u70b9\u6570\u7ec4\u5bf9\u8c61\uff08VAO\uff09\u6982\u8ff0<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u9876\u70b9\u6570\u7ec4\u5bf9\u8c61\uff08VAO\uff0cVertex Array Object\uff09\u662f OpenGL \u4e2d\u7684\u4e00\u4e2a\u91cd\u8981\u6982\u5ff5\uff0c\u5b83\u662f\u4e00\u4e2a\u5c01\u88c5\u4e86\u9876\u70b9\u6570\u636e\u72b6\u6001\u7684\u5bf9\u8c61\u3002VAO \u7684\u4f5c\u7528\u662f\u7ba1\u7406\u9876\u70b9\u6570\u636e\uff08\u5982\u4f4d\u7f6e\u3001\u6cd5\u7ebf\u3001\u7eb9\u7406\u5750\u6807\u7b49\uff09\u7684\u5e03\u5c40\u548c\u5982\u4f55\u5c06\u5b83\u4eec\u4f20\u9012\u7ed9\u7740\u8272\u5668\uff0c\u7b80\u5316\u4e86\u9876\u70b9\u6570\u636e\u7684\u7ba1\u7406\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5728 OpenGL \u4e2d\uff0cVAO \u5e76\u4e0d\u76f4\u63a5\u5b58\u50a8\u9876\u70b9\u6570\u636e\uff0c\u800c\u662f\u5b58\u50a8\u4e86\u4e00\u7ec4\u5173\u4e8e\u5982\u4f55\u4ece\u7f13\u51b2\u533a\uff08VBO\uff09\u4e2d\u8bfb\u53d6\u9876\u70b9\u6570\u636e\u7684\u72b6\u6001\u914d\u7f6e\u3002\u8fd9\u610f\u5473\u7740 VAO \u8bb0\u5f55\u4e86\u4e00\u4e2a\u9876\u70b9\u6570\u7ec4\u7684\u5e03\u5c40\u4fe1\u606f\uff0c\u5e76\u6307\u5b9a\u4e86\u6bcf\u4e2a\u9876\u70b9\u5c5e\u6027\u7684\u7f13\u51b2\u533a\u7ed1\u5b9a\u60c5\u51b5\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2. VAO \u7684\u5de5\u4f5c\u539f\u7406<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>\u9876\u70b9\u5c5e\u6027\u914d\u7f6e<\/strong>\uff1aVAO \u4fdd\u5b58\u4e86\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff08\u5982\u4f4d\u7f6e\u3001\u989c\u8272\u3001\u6cd5\u7ebf\u7b49\uff09\u7684\u8bbe\u7f6e\uff0c\u5b83\u5e76\u4e0d\u4fdd\u5b58\u5b9e\u9645\u7684\u6570\u636e\uff0c\u800c\u662f\u8bb0\u5f55\u4e86\u5982\u4f55\u8bfb\u53d6\u8fd9\u4e9b\u6570\u636e\u7684\u4fe1\u606f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>\u9876\u70b9\u6570\u636e\u4e0e VAO \u5173\u8054<\/strong>\uff1a\u901a\u5e38\uff0c\u6211\u4eec\u4f1a\u5148\u521b\u5efa\u4e00\u4e2a <strong>VBO<\/strong>\uff08Vertex Buffer Object\uff09\uff0c\u7136\u540e\u5c06\u8fd9\u4e9b VBO \u548c\u9876\u70b9\u5c5e\u6027\u6307\u9488\u4e0e\u4e00\u4e2a VAO \u5173\u8054\u8d77\u6765\u3002VAO \u4f1a\u4fdd\u7559\u6240\u6709\u7684\u5c5e\u6027\u6307\u9488\u548c\u7f13\u51b2\u533a\u7ed1\u5b9a\u72b6\u6001\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>\u4f7f\u7528 VAO<\/strong>\uff1a\u5f53\u4f60\u8981\u6e32\u67d3\u4e00\u4e2a\u5bf9\u8c61\u65f6\uff0c\u53ea\u9700\u8981\u7ed1\u5b9a VAO\uff0cOpenGL \u4f1a\u81ea\u52a8\u6839\u636e VAO \u4e2d\u7684\u914d\u7f6e\u4ece\u5bf9\u5e94\u7684\u7f13\u51b2\u533a\u4e2d\u8bfb\u53d6\u9876\u70b9\u6570\u636e\u5e76\u4f20\u9012\u7ed9\u7740\u8272\u5668\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3. VAO \u7684\u4f7f\u7528\u6b65\u9aa4<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">1. <strong>\u521b\u5efa VAO<\/strong>\uff1a\u9996\u5148\u521b\u5efa\u4e00\u4e2a VAO \u5bf9\u8c61\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">2. <strong>\u7ed1\u5b9a VAO<\/strong>\uff1a\u5c06 VAO \u7ed1\u5b9a\u5230\u5f53\u524d\u7684 OpenGL \u72b6\u6001\u4e2d\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">3. <strong>\u914d\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488<\/strong>\uff1a\u4f7f\u7528 glVertexAttribPointer \u914d\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u6307\u5b9a\u5982\u4f55\u89e3\u6790 VBO \u4e2d\u7684\u6570\u636e\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">4. <strong>\u542f\u7528\u9876\u70b9\u5c5e\u6027<\/strong>\uff1a\u4f7f\u7528 glEnableVertexAttribArray \u542f\u7528\u6307\u5b9a\u7684\u9876\u70b9\u5c5e\u6027\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">5. <strong>\u89e3\u7ed1 VAO \u548c VBO<\/strong>\uff1a\u5b8c\u6210\u914d\u7f6e\u540e\uff0c\u89e3\u7ed1 VAO \u548c VBO\uff0c\u4ee5\u4fbf\u4e8e\u7ba1\u7406\u548c\u907f\u514d\u72b6\u6001\u51b2\u7a81\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>4. \u4ee3\u7801\u793a\u4f8b<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0b\u662f\u4e00\u4e2a OpenGL \u6e32\u67d3\u7a0b\u5e8f\u7684\u793a\u4f8b\uff0c\u5c55\u793a\u5982\u4f55\u4f7f\u7528 VAO \u548c VBO \u6765\u6e32\u67d3\u4e00\u4e2a\u7b80\u5355\u7684\u4e09\u89d2\u5f62\uff1a<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>1. \u521b\u5efa VAO \u548c VBO\uff1a<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">GLuint VAO, VBO;\nglGenVertexArrays(1, &amp;VAO);   \/\/ \u521b\u5efa VAO\nglGenBuffers(1, &amp;VBO);         \/\/ \u521b\u5efa VBO\n\nglBindVertexArray(VAO);        \/\/ \u7ed1\u5b9a VAO\n\nglBindBuffer(GL_ARRAY_BUFFER, VBO);  \/\/ \u7ed1\u5b9a VBO\nfloat vertices[] = {\n    \/\/ \u4f4d\u7f6e                \/\/ \u989c\u8272\n    0.0f,  0.5f, 0.0f,   1.0f, 0.0f, 0.0f,  \/\/ \u9876\u70b91 (\u7eff\u8272)\n   -0.5f, -0.5f, 0.0f,   0.0f, 1.0f, 0.0f,  \/\/ \u9876\u70b92 (\u7ea2\u8272)\n    0.5f, -0.5f, 0.0f,   0.0f, 0.0f, 1.0f   \/\/ \u9876\u70b93 (\u84dd\u8272)\n};\n\nglBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);  \/\/ \u586b\u5145 VBO\n\n\/\/ \u8bbe\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\nglVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);  \/\/ \u9876\u70b9\u4f4d\u7f6e\nglEnableVertexAttribArray(0);  \/\/ \u542f\u7528\u9876\u70b9\u4f4d\u7f6e\u5c5e\u6027\n\nglVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));  \/\/ \u9876\u70b9\u989c\u8272\nglEnableVertexAttribArray(1);  \/\/ \u542f\u7528\u9876\u70b9\u989c\u8272\u5c5e\u6027\n\nglBindBuffer(GL_ARRAY_BUFFER, 0);  \/\/ \u89e3\u7ed1 VBO\n\nglBindVertexArray(0);  \/\/ \u89e3\u7ed1 VAO<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2. \u6e32\u67d3\u5faa\u73af\u4e2d\u7684\u4f7f\u7528\uff1a<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5728\u6e32\u67d3\u5faa\u73af\u4e2d\uff0c\u4f60\u53ea\u9700\u7ed1\u5b9a VAO \u5e76\u7ed8\u5236\u5373\u53ef\uff1a<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">glClear(GL_COLOR_BUFFER_BIT);  \/\/ \u6e05\u7a7a\u5c4f\u5e55\n\n\/\/ \u7ed1\u5b9a VAO\nglBindVertexArray(VAO);\n\n\/\/ \u7ed8\u5236\u4e09\u89d2\u5f62\nglDrawArrays(GL_TRIANGLES, 0, 3);\n\nglBindVertexArray(0);  \/\/ \u89e3\u7ed1 VAO<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3. \u5b8c\u6574\u4ee3\u7801\uff1a<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">#include &lt;GL\/glew.h>\n#include &lt;GLFW\/glfw3.h>\n#include &lt;iostream>\n\n\/\/ \u9876\u70b9\u7740\u8272\u5668\u4ee3\u7801\nconst char* vertexShaderSource = R\"(\n#version 330 core\nlayout(location = 0) in vec3 aPos;\nlayout(location = 1) in vec3 aColor;\nout vec3 ourColor;\nvoid main()\n{\n    gl_Position = vec4(aPos, 1.0);\n    ourColor = aColor;\n}\n)\";\n\n\/\/ \u7247\u6bb5\u7740\u8272\u5668\u4ee3\u7801\nconst char* fragmentShaderSource = R\"(\n#version 330 core\nin vec3 ourColor;\nout vec4 FragColor;\nvoid main()\n{\n    FragColor = vec4(ourColor, 1.0f);\n}\n)\";\n\nint main() {\n    \/\/ \u521d\u59cb\u5316 GLFW\n    if (!glfwInit()) {\n        std::cerr &lt;&lt; \"GLFW\u521d\u59cb\u5316\u5931\u8d25!\" &lt;&lt; std::endl;\n        return -1;\n    }\n\n    \/\/ \u521b\u5efa\u7a97\u53e3\n    GLFWwindow* window = glfwCreateWindow(800, 600, \"OpenGL VAO Example\", NULL, NULL);\n    if (!window) {\n        std::cerr &lt;&lt; \"\u7a97\u53e3\u521b\u5efa\u5931\u8d25!\" &lt;&lt; std::endl;\n        glfwTerminate();\n        return -1;\n    }\n    glfwMakeContextCurrent(window);\n    glewInit();\n\n    \/\/ \u7f16\u8bd1\u9876\u70b9\u7740\u8272\u5668\u548c\u7247\u6bb5\u7740\u8272\u5668\n    GLuint vertexShader = glCreateShader(GL_VERTEX_SHADER);\n    glShaderSource(vertexShader, 1, &amp;vertexShaderSource, NULL);\n    glCompileShader(vertexShader);\n\n    GLuint fragmentShader = glCreateShader(GL_FRAGMENT_SHADER);\n    glShaderSource(fragmentShader, 1, &amp;fragmentShaderSource, NULL);\n    glCompileShader(fragmentShader);\n\n    GLuint shaderProgram = glCreateProgram();\n    glAttachShader(shaderProgram, vertexShader);\n    glAttachShader(shaderProgram, fragmentShader);\n    glLinkProgram(shaderProgram);\n    glUseProgram(shaderProgram);\n\n    \/\/ \u521b\u5efa VAO \u548c VBO\n    GLuint VAO, VBO;\n    glGenVertexArrays(1, &amp;VAO);\n    glGenBuffers(1, &amp;VBO);\n\n    glBindVertexArray(VAO);\n\n    glBindBuffer(GL_ARRAY_BUFFER, VBO);\n    float vertices[] = {\n        0.0f,  0.5f, 0.0f,   1.0f, 0.0f, 0.0f,  \/\/ \u9876\u70b91 (\u7ea2\u8272)\n       -0.5f, -0.5f, 0.0f,   0.0f, 1.0f, 0.0f,  \/\/ \u9876\u70b92 (\u7eff\u8272)\n        0.5f, -0.5f, 0.0f,   0.0f, 0.0f, 1.0f   \/\/ \u9876\u70b93 (\u84dd\u8272)\n    };\n    glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);\n\n    glVertexAttribPointer(0, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)0);\n    glEnableVertexAttribArray(0);\n    glVertexAttribPointer(1, 3, GL_FLOAT, GL_FALSE, 6 * sizeof(float), (void*)(3 * sizeof(float)));\n    glEnableVertexAttribArray(1);\n\n    glBindBuffer(GL_ARRAY_BUFFER, 0);\n    glBindVertexArray(0);\n\n    \/\/ \u6e32\u67d3\u5faa\u73af\n    while (!glfwWindowShouldClose(window)) {\n        glClear(GL_COLOR_BUFFER_BIT);\n\n        glUseProgram(shaderProgram);\n        glBindVertexArray(VAO);\n        glDrawArrays(GL_TRIANGLES, 0, 3);\n        glBindVertexArray(0);\n\n        glfwSwapBuffers(window);\n        glfwPollEvents();\n    }\n\n    \/\/ \u6e05\u7406\u8d44\u6e90\n    glDeleteVertexArrays(1, &amp;VAO);\n    glDeleteBuffers(1, &amp;VBO);\n    glDeleteShader(vertexShader);\n    glDeleteShader(fragmentShader);\n\n    glfwTerminate();\n    return 0;\n}<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>5. \u4ee3\u7801\u89e3\u91ca<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">1. <strong>\u521b\u5efa\u548c\u7ed1\u5b9a VAO \u548c VBO<\/strong>\uff1a<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glGenVertexArrays(1, &amp;VAO) \u548c glGenBuffers(1, &amp;VBO) \u7528\u4e8e\u751f\u6210 VAO \u548c VBO\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glBindVertexArray(VAO) \u7ed1\u5b9a VAO\uff0c\u8fd9\u4f1a\u6fc0\u6d3b VAO\uff0c\u4e4b\u540e\u7684\u9876\u70b9\u5c5e\u6027\u6307\u9488\u8bbe\u7f6e\u4f1a\u4fdd\u5b58\u5728\u8fd9\u4e2a VAO \u4e2d\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glBindBuffer(GL_ARRAY_BUFFER, VBO) \u7ed1\u5b9a VBO\uff0c\u7136\u540e\u7528 glBufferData \u5c06\u9876\u70b9\u6570\u636e\u4f20\u9012\u7ed9 GPU\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 \u4f7f\u7528 glVertexAttribPointer \u8bbe\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u5e76\u901a\u8fc7 glEnableVertexAttribArray \u542f\u7528\u8fd9\u4e9b\u5c5e\u6027\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">2. <strong>\u6e32\u67d3\u5faa\u73af<\/strong>\uff1a<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glClear(GL_COLOR_BUFFER_BIT) \u6e05\u7a7a\u5c4f\u5e55\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glBindVertexArray(VAO) \u7ed1\u5b9a VAO \u540e\u7ed8\u5236\u4e09\u89d2\u5f62\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 glDrawArrays(GL_TRIANGLES, 0, 3) \u7ed8\u5236\u4e09\u89d2\u5f62\uff0c0 \u662f\u4ece\u54ea\u4e2a\u9876\u70b9\u5f00\u59cb\u7ed8\u5236\uff0c3 \u662f\u7ed8\u5236\u7684\u9876\u70b9\u6570\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">3. <strong>\u8d44\u6e90\u6e05\u7406<\/strong>\uff1a\u4f7f\u7528 glDeleteVertexArrays \u548c glDeleteBuffers \u5220\u9664 VAO \u548c VBO\uff0c\u907f\u514d\u5185\u5b58\u6cc4\u6f0f\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>6. \u603b\u7ed3<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>VAO<\/strong> \u662f\u7ba1\u7406\u9876\u70b9\u6570\u636e\u548c\u5c5e\u6027\u5e03\u5c40\u7684\u5bf9\u8c61\uff0c\u5b83\u7b80\u5316\u4e86\u9876\u70b9\u5c5e\u6027\u7684\u914d\u7f6e\u548c\u7ed1\u5b9a\uff0c\u4f7f\u5f97\u6e32\u67d3\u65f6\u53ea\u9700\u8981\u7ed1\u5b9a VAO \u5373\u53ef\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>VBO<\/strong> \u5b58\u50a8\u4e86\u9876\u70b9\u6570\u636e\uff0c\u800c <strong>VAO<\/strong> \u5b58\u50a8\u4e86\u5982\u4f55\u4f7f\u7528\u8fd9\u4e9b\u6570\u636e\u7684\u914d\u7f6e\u4fe1\u606f\uff0c\u5305\u62ec\u9876\u70b9\u5c5e\u6027\u6307\u9488\u7684\u72b6\u6001\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8fd9\u6837\u505a\u7684\u597d\u5904\u662f\uff0c\u4e00\u65e6\u914d\u7f6e\u597d VAO\uff0c\u4e4b\u540e\u53ea\u9700\u8981\u7ed1\u5b9a VAO \u548c\u7ed8\u5236\u5bf9\u8c61\uff0c\u4e0d\u9700\u8981\u6bcf\u6b21\u90fd\u91cd\u65b0\u8bbe\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u5927\u5927\u7b80\u5316\u4e86\u6e32\u67d3\u8fc7\u7a0b\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>1. \u9876\u70b9\u6570\u7ec4\u5bf9\u8c61\uff08VAO\uff09\u6982\u8ff0 \u9876\u70b9\u6570\u7ec4\u5bf9\u8c61\uff08VAO\uff0cVertex Array Object\uff09\u662f OpenGL \u4e2d\u7684\u4e00\u4e2a\u91cd\u8981\u6982\u5ff5\uff0c\u5b83\u662f\u4e00\u4e2a\u5c01\u88c5\u4e86\u9876\u70b9\u6570\u636e\u72b6\u6001\u7684\u5bf9\u8c61\u3002VAO \u7684\u4f5c\u7528\u662f\u7ba1\u7406\u9876\u70b9\u6570\u636e\uff08\u5982\u4f4d\u7f6e\u3001\u6cd5\u7ebf\u3001\u7eb9\u7406\u5750\u6807\u7b49\uff09\u7684\u5e03\u5c40\u548c\u5982\u4f55\u5c06\u5b83\u4eec\u4f20\u9012\u7ed9\u7740\u8272\u5668\uff0c\u7b80\u5316\u4e86\u9876\u70b9\u6570\u636e\u7684\u7ba1\u7406\u3002 \u5728 OpenGL \u4e2d\uff0cVAO \u5e76\u4e0d\u76f4\u63a5\u5b58\u50a8\u9876\u70b9\u6570\u636e\uff0c\u800c\u662f\u5b58\u50a8\u4e86\u4e00\u7ec4\u5173\u4e8e\u5982\u4f55\u4ece\u7f13\u51b2\u533a\uff08VBO\uff09\u4e2d\u8bfb\u53d6\u9876\u70b9\u6570\u636e\u7684\u72b6\u6001\u914d\u7f6e\u3002\u8fd9\u610f\u5473\u7740 VAO \u8bb0\u5f55\u4e86\u4e00\u4e2a\u9876\u70b9\u6570\u7ec4\u7684\u5e03\u5c40\u4fe1\u606f\uff0c\u5e76\u6307\u5b9a\u4e86\u6bcf\u4e2a\u9876\u70b9\u5c5e\u6027\u7684\u7f13\u51b2\u533a\u7ed1\u5b9a\u60c5\u51b5\u3002 2. VAO \u7684\u5de5\u4f5c\u539f\u7406 \u2022 \u9876\u70b9\u5c5e\u6027\u914d\u7f6e\uff1aVAO \u4fdd\u5b58\u4e86\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff08\u5982\u4f4d\u7f6e\u3001\u989c\u8272\u3001\u6cd5\u7ebf\u7b49\uff09\u7684\u8bbe\u7f6e\uff0c\u5b83\u5e76\u4e0d\u4fdd\u5b58\u5b9e\u9645\u7684\u6570\u636e\uff0c\u800c\u662f\u8bb0\u5f55\u4e86\u5982\u4f55\u8bfb\u53d6\u8fd9\u4e9b\u6570\u636e\u7684\u4fe1\u606f\u3002 \u2022 \u9876\u70b9\u6570\u636e\u4e0e VAO \u5173\u8054\uff1a\u901a\u5e38\uff0c\u6211\u4eec\u4f1a\u5148\u521b\u5efa\u4e00\u4e2a VBO\uff08Vertex Buffer Object\uff09\uff0c\u7136\u540e\u5c06\u8fd9\u4e9b VBO \u548c\u9876\u70b9\u5c5e\u6027\u6307\u9488\u4e0e\u4e00\u4e2a VAO \u5173\u8054\u8d77\u6765\u3002VAO \u4f1a\u4fdd\u7559\u6240\u6709\u7684\u5c5e\u6027\u6307\u9488\u548c\u7f13\u51b2\u533a\u7ed1\u5b9a\u72b6\u6001\u3002 \u2022 \u4f7f\u7528 VAO\uff1a\u5f53\u4f60\u8981\u6e32\u67d3\u4e00\u4e2a\u5bf9\u8c61\u65f6\uff0c\u53ea\u9700\u8981\u7ed1\u5b9a VAO\uff0cOpenGL \u4f1a\u81ea\u52a8\u6839\u636e VAO \u4e2d\u7684\u914d\u7f6e\u4ece\u5bf9\u5e94\u7684\u7f13\u51b2\u533a\u4e2d\u8bfb\u53d6\u9876\u70b9\u6570\u636e\u5e76\u4f20\u9012\u7ed9\u7740\u8272\u5668\u3002 3. VAO \u7684\u4f7f\u7528\u6b65\u9aa4 1. \u521b\u5efa VAO\uff1a\u9996\u5148\u521b\u5efa\u4e00\u4e2a VAO \u5bf9\u8c61\u3002 2. \u7ed1\u5b9a VAO\uff1a\u5c06 VAO \u7ed1\u5b9a\u5230\u5f53\u524d\u7684 OpenGL \u72b6\u6001\u4e2d\u3002 3. \u914d\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff1a\u4f7f\u7528 glVertexAttribPointer \u914d\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u6307\u5b9a\u5982\u4f55\u89e3\u6790 VBO \u4e2d\u7684\u6570\u636e\u3002 4. \u542f\u7528\u9876\u70b9\u5c5e\u6027\uff1a\u4f7f\u7528 glEnableVertexAttribArray \u542f\u7528\u6307\u5b9a\u7684\u9876\u70b9\u5c5e\u6027\u3002 5. \u89e3\u7ed1 VAO \u548c VBO\uff1a\u5b8c\u6210\u914d\u7f6e\u540e\uff0c\u89e3\u7ed1 VAO \u548c VBO\uff0c\u4ee5\u4fbf\u4e8e\u7ba1\u7406\u548c\u907f\u514d\u72b6\u6001\u51b2\u7a81\u3002 4. \u4ee3\u7801\u793a\u4f8b \u4ee5\u4e0b\u662f\u4e00\u4e2a OpenGL \u6e32\u67d3\u7a0b\u5e8f\u7684\u793a\u4f8b\uff0c\u5c55\u793a\u5982\u4f55\u4f7f\u7528 VAO \u548c VBO \u6765\u6e32\u67d3\u4e00\u4e2a\u7b80\u5355\u7684\u4e09\u89d2\u5f62\uff1a 1. \u521b\u5efa VAO \u548c VBO\uff1a 2. \u6e32\u67d3\u5faa\u73af\u4e2d\u7684\u4f7f\u7528\uff1a \u5728\u6e32\u67d3\u5faa\u73af\u4e2d\uff0c\u4f60\u53ea\u9700\u7ed1\u5b9a VAO \u5e76\u7ed8\u5236\u5373\u53ef\uff1a 3. \u5b8c\u6574\u4ee3\u7801\uff1a 5. \u4ee3\u7801\u89e3\u91ca 1. \u521b\u5efa\u548c\u7ed1\u5b9a VAO \u548c VBO\uff1a \u2022 glGenVertexArrays(1, &amp;VAO) \u548c glGenBuffers(1, &amp;VBO) \u7528\u4e8e\u751f\u6210 VAO \u548c VBO\u3002 \u2022 glBindVertexArray(VAO) \u7ed1\u5b9a VAO\uff0c\u8fd9\u4f1a\u6fc0\u6d3b VAO\uff0c\u4e4b\u540e\u7684\u9876\u70b9\u5c5e\u6027\u6307\u9488\u8bbe\u7f6e\u4f1a\u4fdd\u5b58\u5728\u8fd9\u4e2a VAO \u4e2d\u3002 \u2022 glBindBuffer(GL_ARRAY_BUFFER, VBO) \u7ed1\u5b9a VBO\uff0c\u7136\u540e\u7528 glBufferData \u5c06\u9876\u70b9\u6570\u636e\u4f20\u9012\u7ed9 GPU\u3002 \u2022 \u4f7f\u7528 glVertexAttribPointer \u8bbe\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u5e76\u901a\u8fc7 glEnableVertexAttribArray \u542f\u7528\u8fd9\u4e9b\u5c5e\u6027\u3002 2. \u6e32\u67d3\u5faa\u73af\uff1a \u2022 glClear(GL_COLOR_BUFFER_BIT) \u6e05\u7a7a\u5c4f\u5e55\u3002 \u2022 glBindVertexArray(VAO) \u7ed1\u5b9a VAO \u540e\u7ed8\u5236\u4e09\u89d2\u5f62\u3002 \u2022 glDrawArrays(GL_TRIANGLES, 0, 3) \u7ed8\u5236\u4e09\u89d2\u5f62\uff0c0 \u662f\u4ece\u54ea\u4e2a\u9876\u70b9\u5f00\u59cb\u7ed8\u5236\uff0c3 \u662f\u7ed8\u5236\u7684\u9876\u70b9\u6570\u3002 3. \u8d44\u6e90\u6e05\u7406\uff1a\u4f7f\u7528 glDeleteVertexArrays \u548c glDeleteBuffers \u5220\u9664 VAO \u548c VBO\uff0c\u907f\u514d\u5185\u5b58\u6cc4\u6f0f\u3002 6. \u603b\u7ed3 \u2022 VAO \u662f\u7ba1\u7406\u9876\u70b9\u6570\u636e\u548c\u5c5e\u6027\u5e03\u5c40\u7684\u5bf9\u8c61\uff0c\u5b83\u7b80\u5316\u4e86\u9876\u70b9\u5c5e\u6027\u7684\u914d\u7f6e\u548c\u7ed1\u5b9a\uff0c\u4f7f\u5f97\u6e32\u67d3\u65f6\u53ea\u9700\u8981\u7ed1\u5b9a VAO \u5373\u53ef\u3002 \u2022 VBO \u5b58\u50a8\u4e86\u9876\u70b9\u6570\u636e\uff0c\u800c VAO \u5b58\u50a8\u4e86\u5982\u4f55\u4f7f\u7528\u8fd9\u4e9b\u6570\u636e\u7684\u914d\u7f6e\u4fe1\u606f\uff0c\u5305\u62ec\u9876\u70b9\u5c5e\u6027\u6307\u9488\u7684\u72b6\u6001\u3002 \u8fd9\u6837\u505a\u7684\u597d\u5904\u662f\uff0c\u4e00\u65e6\u914d\u7f6e\u597d VAO\uff0c\u4e4b\u540e\u53ea\u9700\u8981\u7ed1\u5b9a VAO \u548c\u7ed8\u5236\u5bf9\u8c61\uff0c\u4e0d\u9700\u8981\u6bcf\u6b21\u90fd\u91cd\u65b0\u8bbe\u7f6e\u9876\u70b9\u5c5e\u6027\u6307\u9488\uff0c\u5927\u5927\u7b80\u5316\u4e86\u6e32\u67d3\u8fc7\u7a0b\u3002<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17],"tags":[54],"class_list":["post-437","post","type-post","status-publish","format-standard","hentry","category-dev","tag-opengl"],"_links":{"self":[{"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/posts\/437","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/trantor.ink\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=437"}],"version-history":[{"count":1,"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/posts\/437\/revisions"}],"predecessor-version":[{"id":438,"href":"https:\/\/trantor.ink\/index.php?rest_route=\/wp\/v2\/posts\/437\/revisions\/438"}],"wp:attachment":[{"href":"https:\/\/trantor.ink\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=437"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/trantor.ink\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=437"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/trantor.ink\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=437"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}