鸿蒙Next开发中如何添加字体

在鸿蒙Next开发中，如何为应用添加自定义字体？具体步骤是什么？需要将字体文件放在哪个目录下？是否需要额外配置或声明？官方文档是否有相关说明？

2 回复

在鸿蒙Next里加字体，就像给手机换新衣服！

  1. 把字体文件（.ttf/.otf）扔进 resources/base/media 文件夹。
  2. 在 resource_table.json 里写个“身份证”：
    "font": {  
  "my_font": "$media:MyFont"  
}
  3. 在布局里点名使用：ohos:text_font="my_font"
    搞定！系统立马换上你的专属字体皮肤~ 😎

更多关于鸿蒙Next开发中如何添加字体的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在鸿蒙Next（HarmonyOS NEXT）开发中，添加自定义字体可以通过以下步骤实现，使用ArkTS语言编写：

1. 放置字体文件

将字体文件（如.ttf或.otf格式）放入项目的 resources/base/media/ 目录下。例如，添加 custom_font.ttf。

2. 在 ResourceManager 中注册字体

在 entry/src/main/resources/base/profile/ 路径下的 resource_manager.json 文件中添加字体配置：

{
  "resource": [
    {
      "name": "custom_font",
      "src": "$media:custom_font"
    }
  ]
}
  • name：自定义字体名称，在代码中引用。
  • src：字体文件路径，$media: 表示资源类型为媒体。

3. 在代码中使用字体

在ArkTS组件中通过 fontFamily 属性应用字体：

import { Resource } from '@ohos.base';

@Entry
@Component
struct FontExample {
  build() {
    Column() {
      Text('Hello, HarmonyOS!')
        .fontSize(30)
        .fontFamily($r('app.string.custom_font')) // 通过资源ID引用
        .fontWeight(FontWeight.Normal)
    }
    .width('100%')
    .height('100%')
  }
}
  • 使用 $r('app.string.custom_font') 获取字体资源ID，其中 app.string.custom_font 对应 resource_manager.json 中定义的 name。

注意事项：

  • 确保字体文件格式兼容（如.ttf）。
  • 字体文件大小不宜过大，避免影响应用性能。
  • 测试不同设备上的显示效果，确保兼容性。

通过以上步骤，即可在鸿蒙Next应用中成功添加并使用自定义字体。

回到顶部