ios - 使用 MTKView 显示解码的视频流会导致不希望的模糊输出

Question

我已经成功地创建了一个应用程序来接收实时的 h264 编码视频流，然后使用 Video Toolbox 和 AVSampleBufferDisplayLayer 解码并显示视频。这按预期工作，但我希望能够将过滤器应用于渲染输出，因此我改为使用 Video Toolbox 解码并使用 MetalKit 显示/渲染解码视频。我遇到的唯一问题是，我使用 MetalKit 渲染的输出明显比使用 AVSampleBufferDisplayLayer 接收的输出更模糊，我还没有设法找出原因。

这是 AVSampleBufferDisplayLayer 的输出

这是 MetalKit 的输出

我尝试跳过 MetalKit 并直接渲染到 CAMetalLayer，但同样的问题仍然存在。我正在尝试将我的 CVImageBufferRef 转换为可以使用 UIView 显示的 UIImage。如果这也最终变得模糊，那么问题可能出在我的 VTDecompressionSession 而不是 Metal 方面。

解码部分与此处给出的非常相似 How to use VideoToolbox to decompress H.264 video stream

我会尝试只粘贴我的代码中有趣的片段。

这些是我为 VTDecompressionSession 提供的选项。

NSDictionary *destinationImageBufferAttributes = [NSDictionary dictionaryWithObjectsAndKeys:
                                                      [NSNumber numberWithInteger:kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange],
                                                      (id)kCVPixelBufferPixelFormatTypeKey,
                                                      nil];

这是我继承自MTKView的 View

@interface StreamView : MTKView

@property id<MTLCommandQueue> commandQueue;
@property id<MTLBuffer> vertexBuffer;
@property id<MTLBuffer> colorConversionBuffer;
@property id<MTLRenderPipelineState> pipeline;
@property CVMetalTextureCacheRef textureCache;

@property CFMutableArrayRef imageBuffers;

-(id)initWithRect:(CGRect)rect withDelay:(int)delayInFrames;
-(void)addToRenderQueue:(CVPixelBufferRef)image renderAt:(int)frame;

@end

这就是我从 View Controller 初始化 View 的方式。我收到的视频大小相同，即 666x374。

streamView = [[StreamView alloc] initWithRect:CGRectMake(0, 0, 666, 374) withDelay:0];
[self.view addSubview:streamView];

这是StreamView的initWithRect方法的内容

id<MTLDevice> device = MTLCreateSystemDefaultDevice();
self = [super initWithFrame:rect device:device];

self.colorPixelFormat = MTLPixelFormatBGRA8Unorm;
self.commandQueue = [self.device newCommandQueue];
[self buildTextureCache];
[self buildPipeline];
[self buildVertexBuffers];

这是buildPipeline方法

- (void)buildPipeline
{
    NSBundle *bundle = [NSBundle bundleForClass:[self class]];
    id<MTLLibrary> library = [self.device newDefaultLibraryWithBundle:bundle error:NULL];

    id<MTLFunction> vertexFunc = [library newFunctionWithName:@"vertex_main"];
    id<MTLFunction> fragmentFunc = [library newFunctionWithName:@"fragment_main"];

    MTLRenderPipelineDescriptor *pipelineDescriptor = [MTLRenderPipelineDescriptor new];
    pipelineDescriptor.vertexFunction = vertexFunc;
    pipelineDescriptor.fragmentFunction = fragmentFunc;
    pipelineDescriptor.colorAttachments[0].pixelFormat = self.colorPixelFormat;

    self.pipeline = [self.device newRenderPipelineStateWithDescriptor:pipelineDescriptor error:NULL];
}

这是我实际绘制纹理的方式

CVImageBufferRef image = (CVImageBufferRef)CFArrayGetValueAtIndex(_imageBuffers, 0);

id<MTLTexture> textureY = [self getTexture:image pixelFormat:MTLPixelFormatR8Unorm planeIndex:0];
id<MTLTexture> textureCbCr = [self getTexture:image pixelFormat:MTLPixelFormatRG8Unorm planeIndex:1];
if(textureY == NULL || textureCbCr == NULL)
   return;

id<CAMetalDrawable> drawable = self.currentDrawable;

id<MTLCommandBuffer> commandBuffer = [_commandQueue commandBuffer];
MTLRenderPassDescriptor *renderPass = self.currentRenderPassDescriptor;
renderPass.colorAttachments[0].clearColor = MTLClearColorMake(0.5, 1, 0.5, 1);

id<MTLRenderCommandEncoder> commandEncoder = [commandBuffer renderCommandEncoderWithDescriptor:renderPass];
[commandEncoder setRenderPipelineState:self.pipeline];
[commandEncoder setVertexBuffer:self.vertexBuffer offset:0 atIndex:0];
[commandEncoder setFragmentTexture:textureY atIndex:0];
[commandEncoder setFragmentTexture:textureCbCr atIndex:1];
[commandEncoder setFragmentBuffer:_colorConversionBuffer offset:0 atIndex:0];
[commandEncoder drawPrimitives:MTLPrimitiveTypeTriangleStrip vertexStart:0 vertexCount:4 instanceCount:1];
[commandEncoder endEncoding];

[commandBuffer presentDrawable:drawable];
[commandBuffer commit];

这就是我将 CVPixelBufferRef 转换为 MTLTexture 的方法

- (id<MTLTexture>)getTexture:(CVPixelBufferRef)image pixelFormat:(MTLPixelFormat)pixelFormat planeIndex:(int)planeIndex {
    id<MTLTexture> texture;
    size_t width, height;

    if (planeIndex == -1)
    {
        width = CVPixelBufferGetWidth(image);
        height = CVPixelBufferGetHeight(image);
        planeIndex = 0;
    }
    else
    {
        width = CVPixelBufferGetWidthOfPlane(image, planeIndex);
        height = CVPixelBufferGetHeightOfPlane(image, planeIndex);
        NSLog(@"texture %d, %ld, %ld", planeIndex, width, height);
    }

    CVMetalTextureRef textureRef = NULL;
    CVReturn status = CVMetalTextureCacheCreateTextureFromImage(NULL, _textureCache, image, NULL, pixelFormat, width, height, planeIndex, &textureRef);
    if(status == kCVReturnSuccess)
    {
        texture = CVMetalTextureGetTexture(textureRef);
        CFRelease(textureRef);
    }
    else
    {
        NSLog(@"CVMetalTextureCacheCreateTextureFromImage failed with return stats %d", status);
        return NULL;
    }

    return texture;
}

这是我的片段着色器

fragment float4 fragment_main(Varyings in [[ stage_in ]],
                              texture2d<float, access::sample> textureY [[ texture(0) ]],
                              texture2d<float, access::sample> textureCbCr [[ texture(1) ]],
                              constant ColorConversion &colorConversion [[ buffer(0) ]])
{
    constexpr sampler s(address::clamp_to_edge, filter::linear);
    float3 ycbcr = float3(textureY.sample(s, in.texcoord).r, textureCbCr.sample(s, in.texcoord).rg);

    float3 rgb = colorConversion.matrix * (ycbcr + colorConversion.offset);

    return float4(rgb, 1.0);
}

因为我编码的 View 和视频都是 666x374，所以我尝试将片段着色器中的采样类型更改为 filter::nearest。我认为它会以 1:1 的比例匹配像素，但它仍然很模糊。我注意到的另一件奇怪的事情是，如果你在新选项卡中打开上传的图像，你会看到它们比 666x374 大得多......我怀疑我在编码方面犯了错误，即使我当时犯了错误AVSampleBufferDisplayLayer 仍然设法在不模糊的情况下显示视频，因此他们一定是在做我所缺少的正确事情。

Answer 1

看起来你已经解决了最严重的 View 比例问题，其他问题是正确的 YCbCr 渲染(听起来你将通过在解码时输出 BGRA 像素来避免)然后将原始电影缩放到匹配 View 的尺寸。当您请求 BGRA 像素数据时，数据被编码为 sRGB，因此您应该将纹理中的数据视为 sRGB。从 sRGB 纹理读取时，Metal 会自动为您进行非线性到线性的转换，但您必须告诉 Metal 它是 sRGB 像素数据(使用 MTLPixelFormatBGRA8Unorm_sRGB)。要实现缩放，您只需要使用线性重采样从 BGRA 数据渲染到 View 中。如果您想查看 MetalBT709Decoder 的源代码，请参阅我上面链接的 SO 问题，这是我自己的项目，它实现了 BT.709 的正确渲染。