如何在cocos2d-x实现高效的mask(遮罩)

如何在cocos2d-x实现高效的mask(遮罩)

cocos2d-x目前无法利用opengl es2.0的shader来实现mask效果，如果按照老外提供的renderTexture来实现性能就太差了。
遍寻网上后在cocoachina上找到一个深入了解OpenGL-模板测试，经过改造后终于可以在cocos2d-x中使用，与各位同仁分享一下。

先说下模板缓冲（stencil buffer），这在05年还算是一个比较普及的技术。cocos2d-x现在的版本是不支持stencil buffer的，但opengl es是支持的。
可以简单的动手改造一下：
创建stencil buffer。在ES1Renderer.m文件中找到resizeFromLayer方法，将if (depthFormat_){}大括号中的代码替换成以下内容：
if (depthFormat_) 
    {
        if( ! depthBuffer_ )
            glGenRenderbuffersOES(1, &depthBuffer_);
        
        glBindRenderbufferOES(GL_RENDERBUFFER_OES, depthBuffer_);
        if( multiSampling_ )
            glRenderbufferStorageMultisampleAPPLE(GL_RENDERBUFFER_OES, samplesToUse_, depthFormat_,backingWidth_, backingHeight_);
        else
            glRenderbufferStorageOES(GL_RENDERBUFFER_OES, depthFormat_, backingWidth_, backingHeight_);
        glFramebufferRenderbufferOES(GL_FRAMEBUFFER_OES, GL_DEPTH_ATTACHMENT_OES, GL_RENDERBUFFER_OES, depthBuffer_);
                // add by frankyang at 2012/5/8
        glFramebufferRenderbufferOES(GL_FRAMEBUFFER_OES, GL_STENCIL_ATTACHMENT_OES, GL_RENDERBUFFER_OES, depthBuffer_);
            // bind color buffer
        glBindRenderbufferOES(GL_RENDERBUFFER_OES, colorRenderbuffer_);
    }

设置stencil buffer格式。在AppController.mm中找到的didFinishLaunchingWithOpti*****方法，将其中的depthFormat参数改为GL_DEPTH24_STENCIL8_OES，如下：  
   // Add the view controller's view to the window and display.
            window = [[UIWindow alloc] initWithFrame: [[UIScreen mainScreen] bounds]];
            EAGLView *__glView = [EAGLView viewWithFrame: [window bounds]
                                pixelFormat: kEAGLColorFormatRGBA8
                                //depthFormat: GL_DEPTH_COMPONENT16_OES
                                                    depthFormat:GL_DEPTH24_STENCIL8_OES
                                preserveBackbuffer: NO
                                                                sharegroup:nil
                                                                multiSampling:NO
                                                                numberOfSamples:0];

设置每帧渲染开始时清除stencil buffer。在CCDirector.cpp中找到drawScene方法，将其中
        glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)
改成
        glClear(GL_COLOR_BUFFER_BIT | GL_COLOR_DEPTH_BUFFER_BIT | GL_STENCIL_BUFFER_BIT)
这样就可以正确清除stencil buffer。
启动模板测试，设置模板函数。这里要用到三个函数：
glEnable(GL_STENCIL_TEST);
        glStencilFunc(GL_ALWAYS, 0x1, 0x1);
        glStencilOp(GL_REPLACE, GL_REPLACE, GL_REPLACE);

            第一个是启用模板测试，第二个是设置模板测试函数，第三个是设置模板缓冲操作方式。
            模板测试简单来说就是先往模板缓冲中写入模板值，然后渲染时根据模板测试结果来决定像素是否写入color buffer。
            具体解释大家可以看这个帖子深入了解OpenGL-模板测试
            为了灵活的写入模板值，我借鉴了Quaz2D中maskLayer的概念，在要渲染的Layer前后插入MaskBeginLayer和MaskEndLayer。
            用MaskBeginLayer来填充模板缓冲,并设定好之后需要的模板测试函数；用MaskEndLayer来恢复模板测试状态。

    void MaskBeginLayer::visit()
    {        

        if (getChildrenCount() != 0) {

            glEnable(GL_ALPHA_TEST);
            glAlphaFunc(GL_GREATER, 0.0);
        
            glEnable(GL_STENCIL_TEST);
            glStencilFunc(GL_ALWAYS, 0x1, 0x1);
            glStencilOp(GL_REPLACE, GL_REPLACE, GL_REPLACE);
            
            CCLayer::visit();
            
            glDisable(GL_ALPHA_TEST);
            glStencilFunc(GL_NOTEQUAL, 0x1, 0x1);
            glStencilOp(GL_KEEP, GL_KEEP, GL_KEEP);
        }
    }
    void MaskEndLayer::visit()
    {
        glDisable(GL_STENCIL_TEST);
        
        CCLayer::visit();
    }

           这里要注意透明像素也会写入stencil buffer，所有特别用了alphatest。

         经过真机测试，这样实现mask性能是无损的。由于不影响alpha blend，使用起来比较灵活。唯一不好的是mask不支持渐变，要么全透，要么全部透。
         

         现在我在研究直接用alpha blend操作实现mask，性能一样无损，还可以支持渐变，但也有其局限性，且听下回分解。

来自http://www.cocoachina.com/bbs/simple/?t103708.html