在 iOS 4.3 中将 YpCbCr iPhone 4 相机帧渲染为 OpenGL ES 2.0 纹理

Question

我试图在 iPhone 4 上的 iOS 4.3 中将本机平面图像渲染为 OpenGL ES 2.0 纹理。然而，纹理最终变成全黑。我的相机配置如下：

[videoOutput setVideoSettings:[NSDictionary dictionaryWithObject:[NSNumber numberWithInt:kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange] 
                                                          forKey:(id)kCVPixelBufferPixelFormatTypeKey]];

我将像素数据传递到我的纹理，如下所示：

glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, bufferWidth, bufferHeight, 0, GL_RGB_422_APPLE, GL_UNSIGNED_SHORT_8_8_REV_APPLE, CVPixelBufferGetBaseAddress(cameraFrame));

我的片段着色器是：

varying highp vec2 textureCoordinate;

uniform sampler2D videoFrame; 

void main() { 
    lowp vec4 color; 
    color = texture2D(videoFrame, textureCoordinate); 
    lowp vec3 convertedColor = vec3(-0.87075, 0.52975, -1.08175); 
    convertedColor += 1.164 * color.g; // Y
    convertedColor += vec3(0.0, -0.391, 2.018) * color.b; // U
    convertedColor += vec3(1.596, -0.813, 0.0) * color.r; // V
    gl_FragColor = vec4(convertedColor, 1.0); 
} 

我的顶点着色器是

attribute vec4 position;
attribute vec4 inputTextureCoordinate;

varying vec2 textureCoordinate;

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

当我使用 BGRA 图像且仅使用我的片段着色器时，这工作得很好 ？

gl_FragColor = texture2D(videoFrame, textureCoordinate);

如果我在这里缺少什么怎么办 谢谢！

Answer 1

好的。我们在这里取得了工作上的成功。关键是将 Y 和 UV 作为两个单独的纹理传递给片段着色器。这是最终的着色器：

#ifdef GL_ES
precision mediump float;
#endif

varying vec2 textureCoordinate;

uniform sampler2D videoFrame; 
uniform sampler2D videoFrameUV;

const mat3 yuv2rgb = mat3(
                            1, 0, 1.2802,
                            1, -0.214821, -0.380589,
                            1, 2.127982, 0
                            );

void main() {    
    vec3 yuv = vec3(
                    1.1643 * (texture2D(videoFrame, textureCoordinate).r - 0.0625),
                    texture2D(videoFrameUV, textureCoordinate).r - 0.5,
                    texture2D(videoFrameUV, textureCoordinate).a - 0.5
                    );
    vec3 rgb = yuv * yuv2rgb;

    gl_FragColor = vec4(rgb, 1.0);
} 

您需要像这样创建纹理：

int bufferHeight = CVPixelBufferGetHeight(cameraFrame);
int bufferWidth = CVPixelBufferGetWidth(cameraFrame);
glBindTexture(GL_TEXTURE_2D, videoFrameTexture);
glTexImage2D(GL_TEXTURE_2D, 0, GL_LUMINANCE, bufferWidth, bufferHeight, 0, GL_LUMINANCE, GL_UNSIGNED_BYTE, CVPixelBufferGetBaseAddressOfPlane(cameraFrame, 0));

glBindTexture(GL_TEXTURE_2D, videoFrameTextureUV);
glTexImage2D(GL_TEXTURE_2D, 0, GL_LUMINANCE_ALPHA, bufferWidth/2, bufferHeight/2, 0, GL_LUMINANCE_ALPHA, GL_UNSIGNED_BYTE, CVPixelBufferGetBaseAddressOfPlane(cameraFrame, 1));

然后像这样传递它们：

glActiveTexture(GL_TEXTURE0);
glBindTexture(GL_TEXTURE_2D, videoFrameTexture);

glActiveTexture(GL_TEXTURE1);
glBindTexture(GL_TEXTURE_2D, videoFrameTextureUV);

glActiveTexture(GL_TEXTURE0);
glUniform1i(videoFrameUniform, 0);
glUniform1i(videoFrameUniformUV, 1);

天哪，我松了一口气！

PS yuv2rgb 矩阵的值来自这里 http://en.wikipedia.org/wiki/YUV 我复制了代码来自这里 http://www.ogre3d.org/forums/viewtopic.php?f=5&t= 25877 找出如何开始获取正确的 YUV 值。

Answer 2

您的代码似乎尝试将 444+未使用字节中的 32 位颜色转换为 RGBA。那效果不会太好。我不知道有什么东西可以输出“YUVA”。

另外，我认为 BGRA 相机输出返回的 alpha 通道是 0，而不是 1，所以我不确定它为什么有效（IIRC 将其转换为 CGImage，您需要使用 AlphaNoneSkipLast）。

420“双平面”输出的结构如下：

1. 告诉您平面位置的标头（由 CVPixelBufferGetBaseAddressOfPlane() 和朋友使用）
2. Y 平面：高度 × bytes_per_row_1 × 1 字节
3. Cb， Cr 平面：高度/2 × bytes_per_row_2 × 2 字节（每 2x2 块 2 字节）。

bytes_per_row_1 大约为 width，bytes_per_row_2 大约为 width/2，但您需要使用 CVPixelBufferGetBytesPerRowOfPlane()为了稳健性（您可能还想检查 ..GetHeightOfPlane 和 ...GetWidthOfPlane 的结果）。

您可能会幸运地将其视为 1 分量宽度*高度纹理和 2 分量宽度/2*高度/2 纹理。您可能需要检查每行字节数并处理不仅仅是宽度*组件数的情况（尽管对于大多数视频模式来说这可能是正确的）。 AIUI，您还需要在调用 CVPixelBufferUnlockBaseAddress() 之前刷新 GL 上下文。

或者，您可以将其全部以您期望的格式复制到内存中（优化此循环可能有点棘手）。复制的优点是，在解锁像素缓冲区后，您无需担心访问内存的问题。