使用OpenGL实现大量实例化2D对象单独动画的方法求助

当前代码存在两个核心问题导致动画无法生效：

1. 位移数组translations仅在初始化阶段用初始时间计算了一次，渲染循环中更新time变量后，既没有重新计算位移数据，也没有将最新数据上传到GPU，GPU始终读取的是初始化阶段的静态位移值。
2. 使用glDrawArraysInstanced实例化绘制时，没有配置对应的实例化顶点属性，着色器无法获取每个实例的独立位移参数，自然无法将位移应用到对应对象上。

正确实现方案 #

1. 配置实例化顶点属性 #

初始化阶段为VAO添加专门的实例化属性缓冲，用来传递每个实例的独立参数：

// 创建实例化缓冲对象
unsigned int instanceVBO;
glGenBuffers(1, &instanceVBO);
glBindBuffer(GL_ARRAY_BUFFER, instanceVBO);
// 预分配100个vec2位移值的存储空间，使用动态绘制优化更新性能
glBufferData(GL_ARRAY_BUFFER, sizeof(glm::vec2) * 100, nullptr, GL_DYNAMIC_DRAW);

// 绑定到四边形VAO的属性槽
glBindVertexArray(quadVAO);
// 假设位移使用属性槽2，前面0、1槽分别放顶点坐标、颜色
glEnableVertexAttribArray(2);
glVertexAttribPointer(2, 2, GL_FLOAT, GL_FALSE, 2 * sizeof(float), (void*)0);
// 关键配置：该属性每1个实例更新一次，而非每1个顶点更新一次
glVertexAttribDivisor(2, 1);
glBindVertexArray(0);

2. 调整渲染循环逻辑 #

将位移计算、缓冲更新逻辑放到渲染循环中，每帧刷新最新的动画参数：

while (!glfwWindowShouldClose(window))
{
    glClearColor(0.1f, 0.1f, 0.1f, 1.0f);
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);

    float time = glfwGetTime();
    glm::vec2 translations[100];
    int index = 0;
    float offset = 0.1f;
    for (int y = -10; y < 10; y += 2)
    {
        for (int x = -10; x < 10; x += 2)
        {
            glm::vec2 translation;
            // 给每个实例添加差异化参数，实现不同步的独立动画
            translation.x = (float)x / 10.0f + offset + sin(time + x * 0.15f) * 0.4f;
            translation.y = (float)y / 10.0f + offset + cos(time + y * 0.15f) * 0.4f;
            translations[index++] = translation;
        }
    }
    // 将最新位移数据上传到GPU缓冲
    glBindBuffer(GL_ARRAY_BUFFER, instanceVBO);
    glBufferSubData(GL_ARRAY_BUFFER, 0, sizeof(translations), translations);

    shader.use();
    glBindVertexArray(quadVAO);
    glDrawArraysInstanced(GL_TRIANGLES, 0, 6, 100);
    glBindVertexArray(0);

    glfwSwapBuffers(window);
    glfwPollEvents();
}

3. 修改顶点着色器接收实例参数 #

在顶点着色器中添加实例化位移输入，将位移应用到顶点坐标上：

#version 330 core
layout (location = 0) in vec2 aPos;
layout (location = 1) in vec3 aColor;
// 接收实例化位移参数
layout (location = 2) in vec2 aOffset;

out vec3 ourColor;

void main()
{
    gl_Position = vec4(aPos + aOffset, 0.0, 1.0);
    ourColor = aColor;
}

如果需要给每个对象添加旋转、缩放效果，只需要把传递的vec2位移替换为glm::mat4变换矩阵，实例化属性配置时拆分为4个vec4分量设置即可，逻辑和传递位移完全一致。

内容的提问来源于stack exchange，提问作者AKRA