How to draw text in iOS swift using Metal Framework

Question

I am working on a Real-Time Data Monitoring app. I have successfully drawn waves using the Metal framework but I am facing problems while drawing simple text/strings. Like how to print "Hello" in MTKView. Here I am updating the vertices using a timer and then calling draw() to perform drawing. Only GPU rendering is required.

func draw(in view: MTKView) {

    // print("calling")



    //  guard let drawablelayer = metalLayer!.nextDrawable(),
    guard //let mainDrawable = view.currentDrawable,
       // let _pipeLineState = self.pipelineState,
        let discriptor = view.currentRenderPassDescriptor else  {
            return
    }

    let commandBuffer = commandQue.makeCommandBuffer()
    let commandEncoder = commandBuffer?.makeRenderCommandEncoder(descriptor: discriptor)

    //commandEncoder?.setRenderPipelineState(_pipeLineState)





    viewPort = MTLViewport.init(originX: 0.0, originY: 0.0, width: 750, height: 1334, znear: 0.0, zfar: 0.0)
    commandEncoder?.setViewport(viewPort!)




    commandEncoder?.setVertexBuffer(layoutBuffer, offset: 0, index: 0)
    commandEncoder?.setRenderPipelineState(noninterleavedRenderPipeline)
    commandEncoder?.drawPrimitives(type: .triangle, vertexStart:0, vertexCount: verticesLayout.count)


    commandEncoder?.setVertexBuffer(vertexBuffer, offset: 0, index: 0)
    commandEncoder?.setRenderPipelineState(interleavedRenderPipeline)
    commandEncoder?.drawPrimitives(type: .line, vertexStart:0, vertexCount: vertices.count)


    commandEncoder?.setVertexBuffer(topBuffer, offset: 0, index: 0)
    commandEncoder?.setRenderPipelineState(topInterleavedRenderPipeline)
    commandEncoder?.drawPrimitives(type: .triangle, vertexStart:0, vertexCount: verticesRect.count)



    commandEncoder?.endEncoding()
   // commandBuffer?.present(mainDrawable)

    if let drawable = view.currentDrawable {
        commandBuffer?.present(drawable)
    }

    commandBuffer?.commit()


}

Answer 1

There are a number of libraries around, most of which use information directly from fonts to generate lines, Bezier curves, and other primitives that are "procedural" rather than representational (the latter being like a bitmap), and then tessellating them for presentation using Metal primitives.

Warren Moore has a 2018 piece (with code) that describes such an approach using libtess, an established tessilation library. I have not used this version but have played with earlier code that Moore has posted, with some success. You can find it at: https://metalbyexample.com/text-3d/

The article describes 3D text rendering (really artsy stuff) but also has links to other sites that describe simpler 2D solutions.

Warren posted an older 2D Objective-C solution on GitHub at: https://github.com/metal-by-example/sample-code/tree/master/objc/07-Mipmapping/Mipmapping .

It's not for the squeamish, but given the associated code I think you should be able to make progress.

What might strike you as a bit less intimidating, though the results are a bit grainier, is to use Metal Kit to import a Core Graphics texture into which you have written some text. See: https://developer.apple.com/documentation/metalkit/mtktextureloader