如何在Jetpack Compose中使用icon font图标字体？

原有View体系下实现图标字体渲染的核心逻辑是传入图标对应Unicode编码的文本 + 给控件绑定图标字体，这套逻辑在Compose中完全适用，只是对应API做了调整，具体实现步骤如下：

• 前置准备：将iconfont对应的ttf字体文件放置到项目res/font目录下，和View体系的字体存放规则一致，比如命名为icon_font.ttf
• 静态编码场景（图标编码是写死的固定值）：直接在Text组件中传入Unicode转义的图标文本，同时指定图标字体即可

// 初始化图标字体，建议提为全局单例复用，避免重复加载
val IconFontFamily = FontFamily(Font(R.font.icon_font))

// 固定图标编码示例，比如图标编码为0xe612
Text(
    text = "\ue612",
    fontFamily = IconFontFamily,
    fontSize = 24.sp, // 对应原TextView的textSize，控制图标大小
    color = Color(0xFF333333) // 对应原TextView的textColor，控制图标颜色
)

• 动态编码场景（iconValue是运行时获取的变量，比如接口返回、配置读取）：注意Kotlin的\u转义是编译期生效的，不能直接用字符串模板拼接"\u${iconValue}"，需要先把16进制格式的编码值转为对应字符再传入

// 假设iconValue是字符串类型的16进制编码，比如"e612"
val iconText = try {
    val codePoint = iconValue.toInt(16)
    String(Character.toChars(codePoint))
} catch (e: NumberFormatException) {
    "" // 非法编码兜底
}

Text(
    text = iconText,
    fontFamily = IconFontFamily,
    fontSize = 24.sp,
    color = Color(0xFF333333)
)

• 图标与普通文字混排场景：用buildAnnotatedString给图标片段单独指定字体即可，无需像View体系那样手写Span

Text(
    text = buildAnnotatedString {
        // 插入图标
        withStyle(SpanStyle(fontFamily = IconFontFamily, fontSize = 18.sp)) {
            append(iconText)
        }
        append("  配套说明文字")
    },
    fontSize = 14.sp,
    color = Color(0xFF666666)
)

常见坑点：如果渲染出来是方块或者乱码，先检查三点：一是字体文件是否正确引入、字体family是否传对；二是动态编码的转换逻辑是否正确，有没有直接拼接\u和变量；三是传入的编码值和你使用的iconfont版本是否匹配，不要用错字体版本导致编码映射错误。

内容的提问来源于stack exchange，提问作者taylor_nick_1999