使用MTLBuffer进行拷贝顶点数据并进行图形渲染

Metal 拷贝顶点数据的两种方式

1. 根据给定顶点数据集合的指针拷贝顶点数据，但是这种方法只适用于小于4 KB的一次性数据。

   - (void)setVertexBytes:(const void *)bytes 
                   length:(NSUInteger)length 
                  atIndex:(NSUInteger)index;
   

2. 创建一个MTLBuffer全局缓冲区用于存储数据长度超过4 KB或可以多次使用，根据顶点缓冲区拷贝顶点数据。

   
   /* 这个调用有3个参数
       1) buffer - 包含需要传递数据的缓冲对象
       2) offset - 它们从缓冲器的开头字节偏移，指示“顶点指针”指向什么。在这种情况下，我们通过0，所以数据一开始就被传递下来.偏移量
       3) index - 一个整数索引，对应于我们的“vertexShader”函数中的缓冲区属性限定符的索引。注意，此参数与 -[MTLRenderCommandEncoder setVertexBytes:length:atIndex:] “索引”参数相同。
    */- (void)setVertexBuffer:(nullable id )buffer 
                    offset:(NSUInteger)offset 
                   atIndex:(NSUInteger)index;
   

如何使用MTLBuffer进行拷贝顶点数据并进行图形渲染？

流程图.png

与Metal Sample Code (Hello Triangle)
差别仅在于顶点数据的处理。

Shader文件

1. 顶点着色器

   #include 
   //使用命名空间 Metal
   using namespace metal;
   
   // 导入Metal shader 代码和执行Metal API命令的C代码之间共享的头
   #import "CCShaderTypes.h"
   
   // 顶点着色器输出和片段着色器输入
   //结构体
   typedef struct
   {
       //处理空间的顶点信息
       float4 clipSpacePosition [[position]];
   
       //颜色
       float4 color;
   
   } RasterizerData;
   
   //顶点着色函数
   vertex RasterizerData
   vertexShader(uint vertexID [[vertex_id]],
                constant CCVertex *vertices [[buffer(CCVertexInputIndexVertices)]],
                constant vector_uint2 *viewportSizePointer [[buffer(CCVertexInputIndexViewportSize)]])
   {
       /*
        处理顶点数据:
        1) 执行坐标系转换,将生成的顶点剪辑空间写入到返回值中.
        2) 将顶点颜色值传递给返回值
        */
   
       //定义out
       RasterizerData out;
   
       //初始化输出剪辑空间位置
       out.clipSpacePosition = vector_float4(0.0, 0.0, 0.0, 1.0);
   
       // 索引到我们的数组位置以获得当前顶点
       // 我们的位置是在像素维度中指定的.
       float2 pixelSpacePosition = vertices[vertexID].position.xy;
   
       //将vierportSizePointer 从verctor_uint2 转换为vector_float2 类型
       vector_float2 viewportSize = vector_float2(*viewportSizePointer);
   
       //每个顶点着色器的输出位置在剪辑空间中(也称为归一化设备坐标空间,NDC),剪辑空间中的(-1,-1)表示视口的左下角,而(1,1)表示视口的右上角.
       //计算和写入 XY值到我们的剪辑空间的位置.为了从像素空间中的位置转换到剪辑空间的位置,我们将像素坐标除以视口的大小的一半.
       out.clipSpacePosition.xy = pixelSpacePosition / (viewportSize / 2.0);
   
       //把我们输入的颜色直接赋值给输出颜色. 这个值将于构成三角形的顶点的其他颜色值插值,从而为我们片段着色器中的每个片段生成颜色值.
       out.color = vertices[vertexID].color;
   
       //完成! 将结构体传递到管道中下一个阶段:
       return out;
   }
   
   //当顶点函数执行3次,三角形的每个顶点执行一次后,则执行管道中的下一个阶段.栅格化/光栅化.
   
   
   

2. 片元着色器

   
   // 片元函数
   //[[stage_in]],片元着色函数使用的单个片元输入数据是由顶点着色函数输出.然后经过光栅化生成的.单个片元输入函数数据可以使用"[[stage_in]]"属性修饰符.
   //一个顶点着色函数可以读取单个顶点的输入数据,这些输入数据存储于参数传递的缓存中,使用顶点和实例ID在这些缓存中寻址.读取到单个顶点的数据.另外,单个顶点输入数据也可以通过使用"[[stage_in]]"属性修饰符的产生传递给顶点着色函数.
   //被stage_in 修饰的结构体的成员不能是如下这些.Packed vectors 紧密填充类型向量,matrices 矩阵,structs 结构体,references or pointers to type 某类型的引用或指针. arrays,vectors,matrices 标量,向量,矩阵数组.
   fragment float4 fragmentShader(RasterizerData in [[stage_in]])
   {
       //返回输入的片元颜色
       return in.color;
   }
   

初始化

1. 加载Shader文件

    //1.设置绘制纹理的像素格式
       mtkView.colorPixelFormat = MTLPixelFormatBGRA8Unorm_sRGB;
   
       //2.从项目中加载所以的.metal着色器文件
       id defaultLibrary = [_device newDefaultLibrary];
       //从库中加载顶点函数
       id vertexFunction = [defaultLibrary newFunctionWithName:@"vertexShader"];
       //从库中加载片元函数
       id fragmentFunction = [defaultLibrary newFunctionWithName:@"fragmentShader"];
   

2. 加载渲染管道

      //3.配置用于创建管道状态的管道
       MTLRenderPipelineDescriptor *pipelineStateDescriptor = [[MTLRenderPipelineDescriptor alloc] init];
       //管道名称
       pipelineStateDescriptor.label = @"Simple Pipeline";
       //可编程函数,用于处理渲染过程中的各个顶点
       pipelineStateDescriptor.vertexFunction = vertexFunction;
       //可编程函数,用于处理渲染过程总的各个片段/片元
       pipelineStateDescriptor.fragmentFunction = fragmentFunction;
       //设置管道中存储颜色数据的组件格式
       pipelineStateDescriptor.colorAttachments[0].pixelFormat = mtkView.colorPixelFormat;
   
       //4.同步创建并返回渲染管线对象
       NSError *error = NULL;
       _pipelineState = [_device newRenderPipelineStateWithDescriptor:pipelineStateDescriptor
                                                                error:&error];
       //判断是否创建成功
       if (!_pipelineState)
       {
           NSLog(@"Failed to created pipeline state, error %@", error);
       }
   

3. 处理顶点数据

   
       NSData *vertexData = [CCRenderer generateVertexData];
       //创建一个vertex buffer,可以由GPU来读取
       _vertexBuffer = [_device newBufferWithLength:vertexData.length
                                            options:MTLResourceStorageModeShared];
       //复制vertex data 到vertex buffer 通过缓存区的"content"内容属性访问指针
       /*
        memcpy(void *dst, const void *src, size_t n);
        dst:目的地
        src:源内容
        n: 长度
        */
       memcpy(_vertexBuffer.contents, vertexData.bytes, vertexData.length);
       //计算顶点个数 = 顶点数据长度 / 单个顶点大小
       _numVertices = vertexData.length / sizeof(CCVertex);
   

4. 创建命令队列

   _commandQueue = [_device newCommandQueue];
   

渲染(drawInMTKView:)

1. 创建命令缓冲区

      //1.为当前渲染的每个渲染传递创建一个新的命令缓冲区
       id commandBuffer = [_commandQueue commandBuffer];
       //指定缓存区名称
       commandBuffer.label = @"MyCommand";
   

2. 获取渲染描述符

   //2. MTLRenderPassDescriptor:一组渲染目标，用作渲染通道生成的像素的输出目标。
       //currentRenderPassDescriptor 从currentDrawable's texture,view's depth, stencil, and sample buffers and clear values.
       MTLRenderPassDescriptor *renderPassDescriptor = view.currentRenderPassDescriptor;
       //判断渲染目标是否为空
   

3. 通过描述符创建渲染编码器

    //创建渲染命令编码器,这样我们才可以渲染到something
   id renderEncoder =
   [commandBuffer renderCommandEncoderWithDescriptor:renderPassDescriptor];
   //渲染器名称
   renderEncoder.label = @"MyRenderEncoder";
   
   //3.设置我们绘制的可绘制区域
   /*
    typedef struct {
    double originX, originY, width, height, znear, zfar;
    } MTLViewport;
    */
   [renderEncoder setViewport:(MTLViewport){0.0, 0.0, _viewportSize.x, _viewportSize.y, -1.0, 1.0 }];
   
   //4. 设置渲染管道
   [renderEncoder setRenderPipelineState:_pipelineState];
   

4. 设置顶点数据及视口大小

   //将_vertexBuffer 设置到顶点缓存区中
   [renderEncoder setVertexBuffer:_vertexBuffer
                           offset:0
                          atIndex:CCVertexInputIndexVertices];
   
   //将 _viewportSize 设置到顶点缓存区绑定点设置数据
   [renderEncoder setVertexBytes:&_viewportSize
                          length:sizeof(_viewportSize)
                         atIndex:CCVertexInputIndexViewportSize];
   

5. 绘制

   [renderEncoder drawPrimitives:MTLPrimitiveTypeTriangle
                     vertexStart:0
                     vertexCount:_numVertices];
   
   //7/表示已该编码器生成的命令都已完成,并且从NTLCommandBuffer中分离
   [renderEncoder endEncoding];
   
   //8.一旦框架缓冲区完成，使用当前可绘制的进度表
   [commandBuffer presentDrawable:view.currentDrawable];
   
   //9.最后,在这里完成渲染并将命令缓冲区推送到GPU
   [commandBuffer commit];