Custom fonts variants

[danielbuechele]

I'm playing around with the release-1.0 branch, thanks for al the great work on that. I understand that this is still pre-release, so what I am looking for might not be implemented, or not possible at this point.

I am using a custom font in my project like this.

Markdown(content)
    .markdownStyle(MarkdownStyle(
        font: MarkdownStyle.Font.custom("MyCustomFont", size: 16.0),
        foregroundColor: MarkdownStyle.Color(uiColor: R.color.primaryColor()!)
))

However, now bold and italic text is rendered in this font as well. Is there a way to specify a different variant of my font for bold/italic?

[gonzalezreal]

Hi @danielbuechele,

At the moment, MarkdownUI does not support that level of customization. When rendering emphasized text, it takes the current font and applies the corresponding traits: bold, italic, or both.

How would you like to specify a different font for emphasized text? Family name? Design? At the API level, there could be many options.

Btw, thanks for trying the release-1.0 branch. It is currently feature complete and only missing a documentation update. Any feedback is welcome.

[danielbuechele]

Hey thanks for you fast reply! Sorry, the problem might be more my lack of knowledge about iOS font management, rather than your library, then. So my app bundle contains the font files "Inter-Regular.otf", "Inter-Bold.otf" and "Inter-Italic.otf", so creating MarkdownStyle.Font.custom("Inter-Regular", size: 16.0), works fine but the same font is used for bold and italic. You are saying the library "applies the corresponding traits", what exactly does that mean? And how would the library know which font file to use for each trait?

The easiest API I could think of is to add optional parameters, but not sure if that makes sense or is a good idea.

MarkdownStyle(
        font: MarkdownStyle.Font.custom("MyCustomFont", size: 16.0, italic: "MyFont-Italic", bold: "MyFont-bold", boldItalic: "MyFont-Bold-Italic"),
        foregroundColor: MarkdownStyle.Color(uiColor: R.color.primaryColor()!)
)

[gonzalezreal]

Ok, now I understand. The implementation of MarkdownStyle.Font uses withSymbolicTraits to get a bold or italic version of the current font. This method works with system and custom fonts if you provide all the variants. Maybe there is a variant missing, like semi-bold.

Did you try SwiftUI.Font.custom("Inter", size: 16).bold() on a SwiftUI Text view? If that doesn't work either, there are definitely some variants missing.

[danielbuechele]

Oh, I think I figured it out, thanks for you help. The problem was, the name I provided for the base font was "Inter-Regular", the traits seem to be appended to the font name, so the app was looking for "Inter-Regular-Bold", which didn't exist. I changed the name of the base font to "Inter", and now the bold variant name is generated as "Inter-Bold" and it's working as expected.

[shawna-mac]

@danielbuechele Hello! What did you end up doing to solve the issues with bold and italic custom fonts? I'm currently running into the same issue

[shawna-mac]

NVM I figured it out, I was basically doing the same, I had the wrong family name passed in.