How to use custom font in a tvOS project using SwiftUI?

Question

I made an App for iOS and MacOS and I am now working on the tvOS version. The issue I am facing is that the custom font is not working when I use the following code for tvOS!

import SwiftUI

struct TestView: View {
    var body: some View {
      Text("R")
      .font(.custom("Arial Rounded MT Bold", size: 160))
      .bold()
      .shadow(color: Color.black, radius: 15, x: 15, y: 5)
      .foregroundColor(Color(red: 255 / 255.0, green: 194 / 255.0, blue: 58 / 255.0))
    }
}

struct TestView_Previews: PreviewProvider {
    static var previews: some View {
        TestView()
    }
}

The wrong result with the above code is the below letter:

The good letter that should be displayed by the above code should look like the one below:

What am I missing? Thanks

Harshil Patel · Accepted Answer · 2020-11-12 02:38:53Z

1

You are right that works for iOS & macOS but doesn't work for tvOS. Maybe because there are different built-in fonts available for iOS and tvOS? I don't have expertise in tvOS, so please don't assume I'm right. I'm guessing it from this available font list.

tvOS: Try something from this list, and I'm sure it'll work.

iOS:

edited Nov 12, 2020 at 2:38

answered Nov 12, 2020 at 1:35

Harshil Patel

1,4821 gold badge13 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Wild8x Over a year ago

Thanks a lot for your help. Finally I used the font called "Courier" found in your list you forward me. This is the font that is the closest from the rounded letter I wanted. It is a pitty that I could not use the same font I used on iOS and MacOS.

Harshil Patel Over a year ago

@Wild8x If you want to keep fonts the same on all platforms, I prefer you import something your own. For that, I recommend these two Swift | SwiftUI. Let me know if you have any questions!

Wild8x Over a year ago

Hi @Luffy, finally I managed to found the missing fonts on 'cufonfonts.com' and I followed the tutorial you pointed to me... It works fine! Thanks again.

Harshil Patel Over a year ago

@Wild8x glad to hear that :)

Leszek Szary · Accepted Answer · 2025-07-02 08:15:40Z

While your font indeed does not seem to work on tvOS note that you can use a system font with rounded design which looks quite similar (but not exactly the same) to the rounded Arial font you wanted:

Text("R")
    .font(.system(size: 160, weight: .bold, design: .rounded))
    .bold()
    .shadow(color: Color.black, radius: 15, x: 15, y: 5)
    .foregroundColor(Color(red: 255 / 255.0, green: 194 / 255.0, blue: 58 / 255.0))

Also in case someone wants to use a rounded system font in UIKit on tvOS it can also be done:

UIFont.boldSystemFont(ofSize: 160).rounded()

// ...

extension UIFont {
    func rounded() -> UIFont {
        if #available(iOS 13.0, tvOS 13.0, *) {
            guard let descriptor = fontDescriptor.withDesign(.rounded) else {
                return self
            }
            return UIFont(descriptor: descriptor, size: pointSize)
        } else {
            return self
        }
    }
}

Collectives™ on Stack Overflow

How to use custom font in a tvOS project using SwiftUI?

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related