How to use icon font with Jetpack Compose?

Viewed 213

in before xml in TextView we have

holder.binding.iconInfo.text = "&#x${iconValue}"

and set out icon font to it with typeface dose anyone can help same thing but with jetpack compose

1 Answers

The specific syntax you mention that can be used with TextViews is due to the fact that XML is used when defining layouts. That is an XML numeric character entity that specifies a character with its unicode value in hexadecimal notation. So it is not related to TextViews, layouts, fonts or icons.

If you want to do the same with a String in Kotlin and the character value is dynamic, you can do something like this

val text = "${Char(iconValue)}"

In Compose a custom font can be defined either as part of your Theme -> Typography and then used as text style or you can define it directly like this

val fontFamily = FontFamily(
    // If you have the font in resources
    Font(R.font.my_font_normal, weight = FontWeight.Normal),
    Font(R.font.my_font_bold, weight = FontWeight.Bold),
    Font(R.font.my_font_italic, weight = FontWeight.Normal, style = FontStyle.Italic),
    // If you are loading the font at runtime from a file
    Font(File(...), weight = FontWeight.Normal),
    // ...
)

// Use with Text composable
Text(text = text, fontFamily = fontFamily)
Related