[MetalKit]40-Working-with-Particles-in-Metal-part2粒子系统2

本系列文章是对 metalkit.org 上面MetalKit内容的全面翻译和学习.

MetalKit系统文章目录

---

上次咱们学了如何在着色器中用距离函数直接建立一个粒子物体.并能够根据时间来移动物体.可是,若是咱们要使用顶点,那就须要在CPU上定义粒子,并发送顶点数据到GPU.咱们仍是使用上次3D渲染中用过的playground文件,从建立一个Particle结构体开始,建立在咱们metal视图代理类中:

struct Particle {
    var initialMatrix = matrix_identity_float4x4
    var matrix = matrix_identity_float4x4
    var color = float4()
}
复制代码

接着,咱们建立一个粒子数组及一个缓冲器来保存数据.这里咱们仍是给每一个粒子漂亮的蓝色及一个随机的起始位置:

particles = [Particle](repeatElement(Particle(), count: 1000))
particlesBuffer = device.makeBuffer(length: particles.count * MemoryLayout<Particle>.stride, options: [])!
var pointer = particlesBuffer.contents().bindMemory(to: Particle.self, capacity: particles.count)
for _ in particles {
    pointer.pointee.initialMatrix = translate(by: [Float(drand48()) / 10, Float(drand48()) * 10, 0])
    pointer.pointee.color = float4(0.2, 0.6, 0.9, 1)
    pointer = pointer.advanced(by: 1)
}
复制代码

注意:咱们将x坐标除以10来让粒子汇集在很窄的水平范围内,同时咱们将y坐标乘以10来达到相反的效果--让它们在竖直方向上散开些.

下一步,是建立一个球体来做为粒子的网格:

let allocator = MTKMeshBufferAllocator(device: device)
let sphere = MDLMesh(sphereWithExtent: [0.01, 0.01, 0.01], segments: [8, 8], inwardNormals: false, geometryType: .triangles, allocator: allocator)
do { model = try MTKMesh(mesh: sphere, device: device) } 
catch let e { print(e) }
复制代码

接下来,咱们须要一个更新函数来让粒子在屏幕上动起来.在这个函数里,咱们让计时器每帧增加0.01,并根据计时器的值来更新y坐标--建立一种相似下落的运动:

func update() {
    timer += 0.01
    var pointer = particlesBuffer.contents().bindMemory(to: Particle.self, capacity: particles.count)
    for _ in particles {
        pointer.pointee.matrix = translate(by: [0, -3 * timer, 0]) * pointer.pointee.initialMatrix
        pointer = pointer.advanced(by: 1)
    }
}
复制代码

此时,咱们已经准备好在draw方法中来调用这个函数并将数据发送到GPU了:

update()
let submesh = model.submeshes[0]
commandEncoder.setVertexBuffer(model.vertexBuffers[0].buffer, offset: 0, index: 0)
commandEncoder.setVertexBuffer(particlesBuffer, offset: 0, index: 1)
commandEncoder.drawIndexedPrimitives(type: .triangle, indexCount: submesh.indexCount, indexType: submesh.indexType, indexBuffer: submesh.indexBuffer.buffer, indexBufferOffset: 0, instanceCount: particles.count)
复制代码

在Shaders.metal文件中,咱们有一个结构体对应进入和退出的顶点,还有一个给粒子实例使用:

struct VertexIn {
    float4 position [[attribute(0)]];
};

struct VertexOut {
    float4 position [[position]];
    float4 color;
};

struct Particle {
    float4x4 initial_matrix;
    float4x4 matrix;
    float4 color;
};
复制代码

这个顶点着色器使用instance_id属性,咱们能够用这个属性来给一个球体建立许多实例,这个球体正是咱们在顶点缓冲器的索引0中发送到GPU的那个.咱们接着给每个实例赋值一个位置,这个位置是在缓冲器的索引1中存储并发送到GPU的.

vertex VertexOut vertex_main(const VertexIn vertex_in [[stage_in]],
                             constant Particle *particles [[buffer(1)]],
                             uint instanceid [[instance_id]]) {
    VertexOut vertex_out;
    Particle particle = particles[instanceid];
    vertex_out.position = particle.matrix * vertex_in.position ;
    vertex_out.color = particle.color;
    return vertex_out;
}
复制代码

最后,在片断着色器中,咱们返回咱们在顶点着色器中传递过来的颜色:

fragment float4 fragment_main(VertexOut vertex_in [[stage_in]]) {
    return vertex_in.color;
}
复制代码

若是你运行app,你会看到粒子像水流同样落下:

还有一个更加高效的方式来在GPU上渲染粒子.咱们将在下次学习.我想要感谢Caroline的宝贵支持.

源代码source code已发布在Github上.

下次见!