如何在iPhone上的OpenGL ES 2.0中混合使用不同坐標的兩個紋理？

Question

當兩個紋理覆蓋相同的矩形時，我可以在片段着色器中混合使用不同混合模式的兩個紋理。 但現在我的問題是，一個紋理是一個沒有旋轉的普通矩形，另一個紋理是另一個具有旋轉/縮放和平移的矩形。 如何以我想要的方式合並這些紋理？ （在圖片里）

我知道怎么做......

但不知道該怎么做......

為了在一個矩形（第一個圖像）中混合紋理，我使用了以下代碼..

目標C代碼......

- (void) display {
    [EAGLContext setCurrentContext:context];

    glBindFramebuffer(GL_FRAMEBUFFER, targetFBO);

    glUseProgram(program);

    glActiveTexture(GL_TEXTURE2);
    glBindTexture(GL_TEXTURE_2D, textureTop);

    glActiveTexture(GL_TEXTURE3);
    glBindTexture(GL_TEXTURE_2D, textureBot);

    glUniform1i(inputTextureTop, 2);
    glUniform1i(inputTextureBot, 3);

    glUniform1f(alphaTop, alpha);

    glEnable (GL_BLEND);
    glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

    glVertexAttribPointer(position, 2, GL_FLOAT, 0, 0, imageVertices);
    glVertexAttribPointer(inputTextureCoordinate, 2, GL_FLOAT, 0, 0, textureCoordinates);

    glClearColor(0.0, 0.0, 0.0, 0.0);
    glClear(GL_COLOR_BUFFER_BIT);

    glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

    glBindRenderbuffer(GL_RENDERBUFFER, viewRenderbuffer);
    [context presentRenderbuffer:GL_RENDERBUFFER];
}

頂點着色器......

 attribute vec4 position;
 attribute vec4 inputTextureCoordinate;

 varying vec2 textureCoordinate;

 void main()
 {
    gl_Position = position;
    textureCoordinate = inputTextureCoordinate.xy;
 }

片段着色器......

varying highp vec2 textureCoordinate;

uniform sampler2D inputTextureTop;
uniform sampler2D inputTextureBot;

uniform highp float alphaTop;

void main()
{
    lowp vec4 pixelTop = texture2D(inputTextureTop, textureCoordinate);
    lowp vec4 pixelBot = texture2D(inputTextureBot, textureCoordinate);

    gl_FragColor = someBlendOperation(pixelTop, pixelBot);
}

Answer 1

您必須將2個紋理坐標傳遞給着色器並修改着色器

添加到ObjectiveC

glVertexAttribPointer(inputTextureCoordinate2, 2, GL_FLOAT, 0, 0, textureCoordinates2);

頂點着色器

attribute vec4 position;
attribute vec4 inputTextureCoordinate;
attribute vec4 inputTextureCoordinate2;

varying vec2 textureCoordinate;
varying vec2 textureCoordinate2;

void main()
{
    gl_Position = position;
    textureCoordinate = inputTextureCoordinate.xy;
    textureCoordinate2 = inputTextureCoordinate2.xy;
}

Frag Shader

varying highp vec2 textureCoordinate;
varying highp vec2 textureCoordinate2;

uniform sampler2D inputTextureTop;
uniform sampler2D inputTextureBot;

uniform highp float alphaTop;

void main()
{
    lowp vec4 pixelTop = texture2D(inputTextureTop, textureCoordinate);
    lowp vec4 pixelBot = texture2D(inputTextureBot, textureCoordinate2);

    gl_FragColor = someBlendOperation(pixelTop, pixelBot);
}

BTW inputTextureCoordinate不一定是vec4，但可能是vec2

Answer 2

如果要在同一個圖元上混合兩個紋理，則可以在着色器中混合顏色。

但是，如果要混合兩個不同的基元，那么您真正想要使用的是硬件混合（GL_BLEND）。

自己繪制底部圖片，然后啟用混合並繪制頂部圖片。 頂部圖片的alpha值控制它的透明度。

你真的不想嘗試在同一個繪圖調用中繪制兩個四邊形，因為它們不使用相同的坐標。