opengl-es - OpenGL ES 2.0 绘制多个纹理

Question

我相信我的问题很简单，我正在使用 OpenGL ES 2.0 绘制一个简单的 2D 场景。
我有一个拉伸(stretch)整个屏幕的背景纹理和在屏幕上特定位置绘制的花朵(或我说的 Sprite ？)的另一个纹理。

所以我能想到这样做的一个简单原因是调用 glDrawArrays 两次，一次使用背景纹理的顶点，另一次使用花朵纹理的顶点。

这是正确的方法吗？如果是这样，是否意味着对于 10 朵花，我需要调用 glDrawArrays 10 次？

混合怎么样？如果我想将花朵与背景混合，我需要背景和花朵像素颜色，这可能是两次绘制的问题，不是吗？

或者可以一次抽奖吗？如果是这样，我如何创建一个知道它现在是否处理背景纹理顶点或花朵纹理顶点的着色器？

或者是否可以一次性完成？     

一次绘制的问题是着色器需要知道当前顶点是背景顶点(而不是使用背景纹理颜色)还是花朵顶点(而不是使用花朵纹理颜色)，而我不知道怎么做。

以下是我如何使用一次绘制调用来绘制背景图像拉伸(stretch)整个屏幕，并且花朵以一半大小居中。

- (void)renderOnce {
    //... set program, clear color..

    glActiveTexture(GL_TEXTURE2);
    glBindTexture(GL_TEXTURE_2D, backgroundTexture);
    glUniform1i(backgroundTextureUniform, 2);

    glActiveTexture(GL_TEXTURE3);
    glBindTexture(GL_TEXTURE_2D, flowerTexture);
    glUniform1i(flowerTextureUniform, 3);

    static const GLfloat allVertices[] = {
        -1.0f, -1.0f, // background texture coordinates
        1.0f, -1.0f,  // to draw in whole screen
        -1.0f,  1.0f, //
        1.0f,  1.0f,

        -0.5f, -0.5f, // flower texture coordinates
        0.5f, -0.5f,  // to draw half screen size
        -0.5f,  0.5f, // and centered
        0.5f,  0.5f,  //
    };

    // both background and flower texture coords use the whole texture
    static const GLfloat backgroundTextureCoordinates[] = {
        0.0f, 0.0f,
        1.0f, 0.0f,
        0.0f, 1.0f,
        1.0f, 1.0f,
    };

    static const GLfloat flowerTextureCoordinates[] = {
        0.0f, 0.0f,
        1.0f, 0.0f,
        0.0f, 1.0f,
        1.0f, 1.0f,
    };

    glVertexAttribPointer(positionAttribute, 2, GL_FLOAT, 0, 0, allVertices);
    glVertexAttribPointer(backgroundTextureCoordinateAttribute, 2, GL_FLOAT, 0, 0, backgroundTextureCoordinates);
    glVertexAttribPointer(flowerTextureCoordinateAttribute, 2, GL_FLOAT, 0, 0, flowerTextureCoordinates);

    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
}

Answer 1

你有两个选择:

1. 为每个要绘制的纹理调用 glDrawArrays，如果您有超过 10-20 个纹理，这会很慢，为了加快速度，您可以使用硬件 vbo
2. 将所有要绘制的 Sprite 的顶点(顶点，纹理坐标，颜色)批量放入一个数组中，并使用纹理图集(包含您要绘制的所有图片的纹理)并绘制所有这些使用一个 glDrawArrays

第二种方法显然是更好、更正确的方法。要了解如何操作，请查看我的 awnser here