Search code examples
swiftswiftuiclippingcustom-fontembedded-fonts

top of Swift custom font clipping


I have a custom font in my app, I added it to the app properly, I set up the Target Membership, added it to the plist file, etc, everything is fine and the I can use the font, but the top of some characters are clipped:

Top of the 1st line gets clipped

As you can see it only happens in the 1st line, and it only happens with these characters, the rest is OK.

When I select it in the canvas, then it's pretty clear that the top is getting clipped, but adjusting the frame doesn't change this and that's not an option most of the time anyway.

Frame in canvas

Any solution for this? Has anyone else seen this problem before? Is this Swift or SwiftUI related, or there is a problem with the font?

The code itself is super simple:

import SwiftUI

    struct ContentView: View {
        
        var body: some View {
            
            Text("CSOQG-098632 CSOQG-098632")
                .font(.custom("Lausanne-500", size: 44))
                .foregroundColor(.gray)
                
        }
    }

Solution

  • It looks like font baseline problem. As workaround you can compensate it like

    Text("CSOQG-098632 CSOQG-098632")
        .font(.custom("Lausanne-500", size: 44))
        .baselineOffset(-10)                      // << tune here !!
        .foregroundColor(.gray)