如何创建 GPUImage 网格效果

Question

我正在使用 GPUimage 和 xcode 为 iOS 平台开发。

例如，尝试获取实时视频流并将其转换为 9 块 3x3 网格。

我已将视频缩放到 0.33 原始大小，然后尝试应用片段着色器将缩放后的视频重复到其他图块。

但着色器仅适用于缩放后的视频而不是整个视图。

这是我的着色器：

varying highp vec2 textureCoordinate;
uniform sampler2D inputImageTexture;

uniform mediump float range;

void main()
{
    mediump vec2 p = textureCoordinate;


    if (p.x > 0.66) {
        p.x = (p.x-0.66);
    }
    else if (p.x > 0.33) {
        p.x = (p.x-0.33);
    }

    if (p.y > 0.66) {
        p.y = (p.y-0.66);
    }
    else if (p.y > 0.33) {
        p.y = (p.y-0.33);
    }

    lowp vec4 outputColor = texture2D (inputImageTexture, p);
    gl_FragColor = outputColor;
}

有什么建议吗？

Answer 1

 // This is necessary for non-power-of-two textures
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);

视频输入会产生非二次幂纹理。

所以使用的脚本是：

   varying highp vec2 textureCoordinate;
   uniform sampler2D inputImageTexture;

   // num tiles  row x col
   uniform mediump float range;


   void main()
   {
      mediump vec2 p = mod( range * textureCoordinate - vec2( 1.0 ), 1.0 );

      lowp vec4 outputColor = texture2D (inputImageTexture, p);
      gl_FragColor = outputColor;
   }

范围表示行数和列数。

Answer 2

是的，将你的纹理环绕模式设置为 GL_REPEAT，这样你就不需要关心“克隆”了！

glTexParameteri( GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT );
glTexParameteri( GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT );

你的着色器应该是：

varying highp vec2 textureCoordinate;
uniform sampler2D inputImageTexture;

uniform mediump float range;

void main()
{
    mediump vec2 p = 3.0 * textureCoordinate - vec2( 1.0 );
    lowp vec4 outputColor = texture2D (inputImageTexture, p);
    gl_FragColor = outputColor;
}

如果由于某种原因您不想使用 GL_REPEAT，只需使用 mod() 函数自己重复纹理即可：

mediump vec2 p = mod( 3.0 * textureCoordinate - vec2( 1.0 ), 1.0 );