如何通过Metal实现视频文件的渲染?
与Metal 实现摄像头采集内容的渲染 不同的是,获取到的媒体样本是YUV
,需要将其转换为RGB
之后再渲染到屏幕上。
实现视频文件渲染的流程
- 通过
AVAssetReader
直接从存储中读取原始未解码的媒体样本,获取解码为可渲染形式的样本CMSampleBufferRef
。 - 通过
CoreVideo
将采集到的CMSampleBufferRef
获取Y
纹理,UV
纹理。 - 自定义着色器 将
YUV
转换为RGB
值。 - 将纹理数据渲染到屏幕上。
关于AVAssetReader
从存储中读取原始未解码的媒体样本,获取解码为可渲染形式的样本。
着色器
-
vertexShader(顶点坐标、纹理坐标)
vertex RasterizerData vertexShader(uint vertexID [[ vertex_id ]], constant CCVertex *vertexArray [[ buffer(CCVertexInputIndexVertices) ]]) { RasterizerData out; //顶点坐标 out.clipSpacePosition = vertexArray[vertexID].position; //纹理坐标 out.textureCoordinate = vertexArray[vertexID].textureCoordinate; return out; }
-
fragmentShader(采样、YUV转换RGB)
vertex RasterizerData vertexShader(uint vertexID [[ vertex_id ]], constant CCVertex *vertexArray [[ buffer(CCVertexInputIndexVertices) ]]) { RasterizerData out; //顶点坐标 out.clipSpacePosition = vertexArray[vertexID].position; //纹理坐标 out.textureCoordinate = vertexArray[vertexID].textureCoordinate; return out; }
初始化
-
初始化
MTKView
-
初始化
AVAssetReader
加载视频资源文件 -
设置渲染管道
-
设置顶点数据
-
设置YUV转换RGB的矩阵数据
// 设置YUV->RGB转换的矩阵 - (void)setupMatrix { //1.转化矩阵 // BT.601, which is the standard for SDTV. matrix_float3x3 kColorConversion601DefaultMatrix = (matrix_float3x3){ (simd_float3){1.164, 1.164, 1.164}, (simd_float3){0.0, -0.392, 2.017}, (simd_float3){1.596, -0.813, 0.0}, }; // BT.601 full range matrix_float3x3 kColorConversion601FullRangeMatrix = (matrix_float3x3){ (simd_float3){1.0, 1.0, 1.0}, (simd_float3){0.0, -0.343, 1.765}, (simd_float3){1.4, -0.711, 0.0}, }; // BT.709, which is the standard for HDTV. matrix_float3x3 kColorConversion709DefaultMatrix[] = { (simd_float3){1.164, 1.164, 1.164}, (simd_float3){0.0, -0.213, 2.112}, (simd_float3){1.793, -0.533, 0.0}, }; //2.偏移量 vector_float3 kColorConversion601FullRangeOffset = (vector_float3){ -(16.0/255.0), -0.5, -0.5}; //3.创建转化矩阵结构体. CCConvertMatrix matrix; //设置转化矩阵 /* kColorConversion601DefaultMatrix; kColorConversion601FullRangeMatrix; kColorConversion709DefaultMatrix; */ matrix.matrix = kColorConversion601FullRangeMatrix; //设置offset偏移量 matrix.offset = kColorConversion601FullRangeOffset; //4.创建转换矩阵缓存区. self.convertMatrix = [self.mtkView.device newBufferWithBytes:&matrix length:sizeof(CCConvertMatrix) options:MTLResourceStorageModeShared]; }
绘制
-
读取帧数据
-
设置顶点缓存区
-
获取
Y/UV
纹理数据,传递数据// 设置纹理 - (void)setupTextureWithEncoder:(id<MTLRenderCommandEncoder>)encoder buffer:(CMSampleBufferRef)sampleBuffer { //1.从CMSampleBuffer读取CVPixelBuffer, CVPixelBufferRef pixelBuffer = CMSampleBufferGetImageBuffer(sampleBuffer); id<MTLTexture> textureY = nil; id<MTLTexture> textureUV = nil; //textureY 设置 { //2.获取纹理的宽高 size_t width = CVPixelBufferGetWidthOfPlane(pixelBuffer, 0); size_t height = CVPixelBufferGetHeightOfPlane(pixelBuffer, 0); //3.像素格式:普通格式,包含一个8位规范化的无符号整数组件。 MTLPixelFormat pixelFormat = MTLPixelFormatR8Unorm; //4.创建CoreVideo的Metal纹理 CVMetalTextureRef texture = NULL; /*5. 根据视频像素缓存区 创建 Metal 纹理缓存区 CVReturn CVMetalTextureCacheCreateTextureFromImage(CFAllocatorRef allocator, CVMetalTextureCacheRef textureCache, CVImageBufferRef sourceImage, CFDictionaryRef textureAttributes, MTLPixelFormat pixelFormat, size_t width, size_t height, size_t planeIndex, CVMetalTextureRef *textureOut); 功能: 从现有图像缓冲区创建核心视频Metal纹理缓冲区。 参数1: allocator 内存分配器,默认kCFAllocatorDefault 参数2: textureCache 纹理缓存区对象 参数3: sourceImage 视频图像缓冲区 参数4: textureAttributes 纹理参数字典.默认为NULL 参数5: pixelFormat 图像缓存区数据的Metal 像素格式常量.注意如果MTLPixelFormatBGRA8Unorm和摄像头采集时设置的颜色格式不一致,则会出现图像异常的情况; 参数6: width,纹理图像的宽度(像素) 参数7: height,纹理图像的高度(像素) 参数8: planeIndex.如果图像缓冲区是平面的,则为映射纹理数据的平面索引。对于非平面图像缓冲区忽略。 参数9: textureOut,返回时,返回创建的Metal纹理缓冲区。 */ CVReturn status = CVMetalTextureCacheCreateTextureFromImage(NULL, self.textureCache, pixelBuffer, NULL, pixelFormat, width, height, 0, &texture); //6.判断textureCache 是否创建成功 if(status == kCVReturnSuccess) { //7.转成Metal用的纹理 textureY = CVMetalTextureGetTexture(texture); //8.使用完毕释放 CFRelease(texture); } } //9.textureUV 设置(同理,参考于textureY 设置) { size_t width = CVPixelBufferGetWidthOfPlane(pixelBuffer, 1); size_t height = CVPixelBufferGetHeightOfPlane(pixelBuffer, 1); MTLPixelFormat pixelFormat = MTLPixelFormatRG8Unorm; CVMetalTextureRef texture = NULL; CVReturn status = CVMetalTextureCacheCreateTextureFromImage(NULL, self.textureCache, pixelBuffer, NULL, pixelFormat, width, height, 1, &texture); if(status == kCVReturnSuccess) { textureUV = CVMetalTextureGetTexture(texture); CFRelease(texture); } } //10.判断textureY 和 textureUV 是否读取成功 if(textureY != nil && textureUV != nil) { //11.向片元函数设置textureY 纹理 [encoder setFragmentTexture:textureY atIndex:CCFragmentTextureIndexTextureY]; //12.向片元函数设置textureUV 纹理 [encoder setFragmentTexture:textureUV atIndex:CCFragmentTextureIndexTextureUV]; } //13.使用完毕,则将sampleBuffer 及时释放 CFRelease(sampleBuffer); }
-
提交绘制
网友评论