在OpenGL中从零开始画一个正方形：初学者指南

2023-09-02 12:23:08







大家好，欢迎来到OpenGL入门系列教程的第三篇。在上一篇文章中，我们已经搭建了OpenGL的环境，现在让我们正式开始使用OpenGL来绘制一个正方形，以便熟悉OpenGL的画图基本流程。

### 初始化库及设置相关参数

```cpp
#include <glad/glad.h>
#include <GLFW/glfw3.h>

// 顶点着色器
const char *vertexShaderSource = "#version 330 core\n"
    "layout (location = 0) in vec3 aPos;\n"
    "void main() {\n"
    "   gl_Position = vec4(aPos, 1.0);\n"
    "}";

// 片段着色器
const char *fragmentShaderSource = "#version 330 core\n"
    "out vec4 FragColor;\n"
    "void main() {\n"
    "   FragColor = vec4(1.0f, 0.5f, 0.2f, 1.0f);\n"
    "}";

上述代码中：

我们首先包含了必要的库文件。
然后定义了顶点着色器和片段着色器的源代码。顶点着色器负责将顶点位置转换为剪裁空间坐标，而片段着色器负责计算每个片段的颜色。
接下来的代码创建了一个窗口，设置OpenGL上下文，并编译和链接着色器程序。

GLFWwindow* window = glfwCreateWindow(800, 600, "OpenGL 正方形", NULL, NULL);
glfwMakeContextCurrent(window);

gladLoadGLLoader((GLADloadproc)glfwGetProcAddress);

// 创建着色器程序
GLuint vertexShader = glCreateShader(GL_VERTEX_SHADER);
glShaderSource(vertexShader, 1, &vertexShaderSource, NULL);
glCompileShader(vertexShader);

GLuint fragmentShader = glCreateShader(GL_FRAGMENT_SHADER);
glShaderSource(fragmentShader, 1, &fragmentShaderSource, NULL);
glCompileShader(fragmentShader);

GLuint shaderProgram = glCreateProgram();
glAttachShader(shaderProgram, vertexShader);
glAttachShader(shaderProgram, fragmentShader);
glLinkProgram(shaderProgram);

// 链接着色器程序
glUseProgram(shaderProgram);

创建并配置顶点数组对象和顶点缓冲对象

接下来，我们需要创建一个顶点数组对象(VAO)和一个顶点缓冲对象(VBO)来存储顶点数据。

// 创建并配置顶点数组对象和顶点缓冲对象
GLuint VAO, VBO;
glGenVertexArrays(1, &VAO);
glGenBuffers(1, &VBO);

glBindVertexArray(VAO);

glBindBuffer(GL_ARRAY_BUFFER, VBO);
glBufferData(GL_ARRAY_BUFFER, sizeof(vertices), vertices, GL_STATIC_DRAW);

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

// 解绑VAO和VBO
glBindBuffer(GL_ARRAY_BUFFER, 0);
glBindVertexArray(0);

上述代码中：

我们首先创建了一个VAO和一个VBO。
然后绑定VAO和VBO。
接下来的代码将顶点数据复制到VBO中。
最后，我们配置顶点属性指针，告诉OpenGL如何从VBO中读取顶点数据。

渲染正方形

现在我们已经完成了所有必要的初始化工作，就可以开始渲染正方形了。

// 渲染正方形
while (!glfwWindowShouldClose(window)) {
    // 检查事件
    glfwPollEvents();

    // 清空颜色缓冲区
    glClearColor(0.2f, 0.3f, 0.3f, 1.0f);
    glClear(GL_COLOR_BUFFER_BIT);

    // 激活着色器程序
    glUseProgram(shaderProgram);

    // 绑定VAO
    glBindVertexArray(VAO);

    // 绘制三角形
    glDrawArrays(GL_TRIANGLES, 0, 6);

    // 交换前后缓冲区
    glfwSwapBuffers(window);
}