在OpenGL ES中绘制多边形以将纹理裁剪为透明

Question

我画了两层。 静态背景纹理和带有透明部分的texture（png）。 我可以正确看到背景，没有任何问题。 我想做的是通过绘制一个多边形（矩形）来修改顶层，该多边形的大小会在运行时更改，以使顶层的该部分透明，以便您看到静态背景。

我在iPhone上使用Cocos2d，发现了作者的一个不错的解决方案 （请参阅＃6），但在他的示例中，他使用另一个PNG文件作为遮罩。 由于将在运行时创建高度和宽度可变的透明零件，因此图像无法正常工作。 我认为，一遍又一遍地绘制图像（蒙版）的开销会很大。

我已经对此进行了一段时间的研究，发现有些人谈论仅在alpha通道上绘制多边形，而我能够使该多边形绘制到该通道上，这并不能使它透明，而只是使颜色稍微亮一些。

我希望我只是缺少一些简单的东西：

        RenderTexture *mBurnLayer = [RenderTexture renderTextureWithWidth:512 height:512];
    Sprite *burn = [Sprite spriteWithFile:@"bg-new.png"];
    [burn setPosition:cpv(480/2,320/2)];
    [mBurnLayer setPosition:cpv(256,256)];
    [mBurnLayer begin];
    glColorMask(TRUE, TRUE, TRUE, TRUE);
    [burn visit];
    glColorMask(TRUE, TRUE, TRUE, FALSE);
    [mBurnLayer end];
    [self addChild:mBurnLayer];

    [mBurnLayer begin];
    glColorMask(FALSE, FALSE, FALSE, TRUE);
    glBlendFunc(GL_SRC_ALPHA, GL_ONE);
    glColor4ub(1, 1, 1, 0.5);
    glLineWidth(10);
    CGPoint vertices[] = { ccp(100,100), ccp(100,200), ccp(200,200), ccp(200,100) };
    drawPoly( vertices, 4, YES);
    glColorMask(TRUE, TRUE, TRUE, TRUE);

我尝试了GL_ONE GL_ZERO GL_ALPHA_FROM_SRC等的大量不同组合...

进一步阅读也许我只需要剪切纹理？ 没有着色器，这可能吗？ 我知道iPhone 3GS可以做着色器，但是早期的做不到。

Answer 1

我想通了，这里是需要任何人将来参考的代码。

RenderTexture *bigBackgroundLayer = [RenderTexture renderTextureWithWidth:512 height:512];
Sprite *bigBackgroundSprite = [Sprite spriteWithFile:@"big_bg.png"];
[bigBackgroundSprite setPosition:cpv(240,150)];
[bigBackgroundLayer setPosition:ccp(240,150)];
[bigBackgroundLayer begin];
glColorMask(TRUE, TRUE, TRUE, TRUE);
[bigBackgroundSprite visit];
glColorMask(TRUE, TRUE, TRUE, FALSE);
[bigBackgroundLayer end];
[self addChild:bigBackgroundLayer z:0];

RenderTexture *gameBoardLayer = [RenderTexture renderTextureWithWidth:512 height:512];
Sprite *gameBoardSprite = [Sprite spriteWithFile:@"bg-new.png"];
[gameBoardSprite setPosition:cpv(480/2,320/2)];
[gameBoardLayer setPosition:cpv(256,256)];
[gameBoardLayer begin];
glColorMask(TRUE, TRUE, TRUE, TRUE);
[gameBoardSprite visit];
glColorMask(TRUE, TRUE, TRUE, FALSE);
[gameBoardLayer end];
[self addChild:gameBoardLayer];

[gameBoardLayer begin];
glColorMask(FALSE, FALSE, FALSE, TRUE);
glBlendFunc(GL_ONE, GL_ZERO);
glColor4ub(1, 1, 1, 0.0);
glLineWidth(10);
CGPoint vertices[] = { ccp(100,100), ccp(100,300), ccp(300,300), ccp(300,100) };
drawPoly( vertices, 4, YES);
glColorMask(TRUE, TRUE, TRUE, TRUE);
[gameBoardLayer end];

这将gameBoardSprite混合到bigBackgroundSprite。 使用内置的drawPoly函数将仅将矩形绘制为直线，我修改了该函数以为GLEnum模式采用一个额外的参数（不在此代码中）并将其设置为GL_TRIANGLE_FAN来填充多边形。

希望这对其他人有帮助。