OpenGLES FBO-BlitFramebuffer MSAA 抗锯齿的实现

OpenGLES FBO-BlitFramebuffer MSAA 抗锯齿的实现

不太好用的FBO-Blit MSAA

昨天写了一篇 OpenGLES 在几种情况下的 MSAA（Multisample Anti-aliasing）抗锯齿，其中唯独没有提到一种利用 FBO-Blit 的抗锯齿方法，那是因为我没能实现。我对 OpenGL MSAA 的大部分代码的了解都是根据 关于支持多重采样的FBO和Texture 这篇博文的描述。他也提到了三种实现MSAA的方法，而我在实现其中第二种方法 FBO-BlitFramebuffer ，在调用 glBlitFramebuffer() 方法时，一直遇到了一个 GL_INVALID_OPERATION 的错误。根据OpenGLES的官方文档显示，在调用该方法时遇到这样的错误是因为 ReadBuffer 与 DrawBuffer 不一致导致的。直到昨天把 RTT MSAA 搞定交差以后，今天忽然心血来潮重新调试这段代码，最终实现了 FBO-BlitFramebuffer MSAA。

FBO BlitFramebuffer MSAA 的实现

首先，定义一个方法，用来作 MultisampleFramebuffer 的初始化工作，该方法可在创建完 GLContext 之后 glDraw() 之前调用一次。

void Renderer::InitMultisampleAntiAliasing(GLint samples) {
    // 创建一个 Multisample Framebuffer，并绑定为当前操作的 Framebuffer。
    glGenFramebuffers(1, &m_MSFBO);
    glBindFramebuffer(GL_FRAMEBUFFER, m_MSFBO);

    // 创建一个 Multisample 的 Renderbuffer colorBuffer
    glGenRenderbuffers(1, &m_MSColor);
    glBindRenderbuffer(GL_RENDERBUFFER, m_MSColor);
    glRenderbufferStorageMultisample(GL_RENDERBUFFER, samples, GL_RGBA8, m_width, m_height); // 请注意这里的 GL_RGBA8，
    checkGLError("GenMSColorBuffer");   
    // 把创建好的 colorBuffer 绑定到 Framebuffer 上。
    glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_RENDERBUFFER, m_MSColor);
    checkGLError("FboRbo,COLORATTACHMENT");

    // 创建一个 Multisample 的 Renderbuffer depthBuffer，如果不适用深度检测，这一步可以省略
    glGenRenderbuffers(1, &m_MSDepth);
    glBindRenderbuffer(GL_RENDERBUFFER, m_MSDepth);
    glRenderbufferStorageMultisample(GL_RENDERBUFFER, samples, GL_DEPTH_COMPONENT16, m_width, m_height);
    checkGLError("GenDepthBuffer");
    // 把创建好的 depthBuffer 绑定到 Framebuffer 上。
    glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT, GL_RENDERBUFFER, m_MSDepth);
    checkGLError("DepthBuffer,Renderbuffer");

    // glDrawBuffers Specifies a list of color buffers to be drawn into
    // 即，定义把图像绘制到 GL_COLOR_ATTACHMENT0 的 Framebuffer 中
    GLenum drawBufs[] = {GL_COLOR_ATTACHMENT0};
    glDrawBuffers(1, drawBufs);
    checkGLError("DrawBuffer");
    // 检查 Framebuffer 的完整性，处理异常情况
    if(glCheckFramebufferStatus(GL_FRAMEBUFFER) != GL_FRAMEBUFFER_COMPLETE) {
        LOG_ERROR("failed to make complete framebuffer object %x", glCheckFramebufferStatus(GL_FRAMEBUFFER));
    }
}

在glDraw() 调用之前，先将上面申请的 Framebuffer 绑定为绘制对象。

glBindFramebuffer(GL_FRAMEBUFFER, m_MSFBO);
glBindRenderbuffer(GL_RENDERBUFFER, m_MSColor);
checkGLError("BindTwoBuffers");

然后调用 glDraw() glFinish() 等绘制指令。然后进行传图：

    glBindFramebuffer(GL_READ_FRAMEBUFFER, m_MSFBO);
    checkGLError("BindReadBuffer");
    glBindFramebuffer(GL_DRAW_FRAMEBUFFER, 0); // 把Framebuffer0，即屏幕绑定为写入Buffer
    checkGLError("BindDrawBuffer");
    glBlitFramebuffer(0, 0, m_width, m_height, 0, 0, m_width, m_height,                 
                        GL_COLOR_BUFFER_BIT, GL_NEAREST);
    checkGLError("BlitFramebufferColor");
    glBlitFramebuffer(0, 0, m_width, m_height, 0, 0, m_width, m_height,
                         GL_DEPTH_BUFFER_BIT, GL_NEAREST);
    checkGLError("BlitFramebufferDepth");
    glBindFramebuffer(GL_READ_FRAMEBUFFER, 0);
    glBindFramebuffer(GL_DRAW_FRAMEBUFFER, 0);

传图完成后，MSAA过的图像就已经绘制在屏幕的Framebuffer上了，只需要再调用一下eglSwapBuffers(_display, _surface) 即可完成整个抗锯齿Demo。

但是

上面的流程看似简单，写起来也不难实现。然而在真正运行时却绘制了一片黑暗。因此，加入了众多 checkGLError("xxx") 语句来打 Log 查错。 checkGLError("xxx") 的原理很简单，里面调用了 glGetError() 并将 Error 名称及位置（传入的 xxx 字符串）打印出来。代码如下：

void Renderer::checkGLError(const char* str) {
    switch (glGetError())
    {
        case GL_NO_ERROR:
            LOG_INFO("ENOGH:NO_ERROR  %s" , str);
            break;
        case GL_INVALID_ENUM:
            LOG_INFO("ENOCH:INVALID_ENUM %s", str);
            break;
        case GL_INVALID_VALUE:
            LOG_INFO("ENOCH:INVALID_VALUE  %s", str);
            break;
        case GL_INVALID_OPERATION:
            LOG_INFO("ENOCH:INVALID_OPERATION   %s", str);
            break;
        case GL_INVALID_FRAMEBUFFER_OPERATION:
            LOG_INFO("ENOCH:INVALID_FRAMEBUFFER_OPERATION  %s", str);
            break;
        case GL_OUT_OF_MEMORY:
            LOG_INFO("ENOCH:OUT_OF_MEMORY  %s", str);
            break;
        default:
            LOG_INFO("SOMETHING_WRONG  %s", str);
            break;
    }
}

于是，在程序运行时，Log 中获得了这样的字样：

…………………………….
ENOCH:NO_ERROR BindDrawBuffer
ENOCH:INVALID_OPERATION BlitFramebufferColor
ENOCH:NO_ERROR BlitFramebufferDepth
………………………….

因此，问题就出现在了glBlitFramebuffer(0, 0, m_width, m_height, 0, 0, m_width, m_height, GL_COLOR_BUFFER_BIT, GL_NEAREST); 这一句调用上。经过一堆尝试，以及去 Stack Overflow 上提问，终于了解到，是创建 Framebuffer 时的一些属性与创建 Context 时的 Attribs 不符。下面，再把上次那个Attribs 贴上来。

    const EGLint attribs[] = {
            EGL_SURFACE_TYPE, EGL_WINDOW_BIT,
            EGL_RENDERABLE_TYPE, EGL_OPENGL_ES2_BIT,
            EGL_BLUE_SIZE, 8,
            EGL_GREEN_SIZE, 8,
            EGL_RED_SIZE, 8,
            EGL_ALPHA_SIZE, 8,        // GL_RGBA8
            EGL_SAMPLE_BUFFERS, 1,    // 不该写
            EGL_SAMPLES, 4,           // 不该写
            EGL_NONE
    };

首先是，我们在 InitMultisampleAntiAliasing() 方法中调用的 glRenderbufferStorageMultisample(GL_RENDERBUFFER, samples, GL_RGBA8, m_width, m_height); // 请注意这里的 GL_RGBA8 这一句，GL_RGBA8，要与 attribs 中的那三个变量对应起来，否则将会报出上面提到的 INVALID_OPERATION 错误。
此外，按照逻辑，这里创建的是 samples = 4 的 Multisample Renderbuffer，本以为 attribs 中也应该有这样的定义，然而事实并非如此。只有把 attribs 中注释为 “不该写” 的两行注释掉，才能正常的绘制出预期的图形。
再此外，DepthBuffer 如果报错，则应考虑是否与“申请 Depth Multisample Renderbuffer 时的属性 与 attribs 中定义的Depth属性不符”有关。我可能是因为调用了 glDisable(GL_DEPTH_TEST)，因此，glBlitFramebuffer depthbuffer 处并未报错。
最后，效果图与上篇文章 jni 环境中的 context MSAA 效果一致，不再贴图了。

欢迎关注我的个人公众号 VR_Tech。
刚刚起步。