HarmonyOS 鸿蒙Next 全局支持iconfont字体图标
HarmonyOS 鸿蒙Next 全局支持iconfont字体图标 https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-font-V5#fontregisterfont
按文档只能在某个页面引入字体图标
在Ability入口引入无效
请问如何全局引入,毕竟每个页面都去写一个那个极大增加代码量
更多关于HarmonyOS 鸿蒙Next 全局支持iconfont字体图标的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
1、全局使用自定义字体,在EntryAbility.ets文件的onWindowStageCreate生命周期中,通过windowStage.loadContent回调注册
import font from '@ohos.font';
onWindowStageCreate(windowStage: window.WindowStage): void {
windowStage.loadContent('pages/registerFont', (err, data) => {
if (err.code) {
return;
}
font.registerFont({
familyName: 'iconfont',
familySrc: $rawfile('AlimamaDaoLiTi.ttf')
})
font.registerFont({
familyName: 'SF',
familySrc: $rawfile('font/SF-Pro-Text-Italic.ttf')
})
});
}
2、registerFont.ets在页面中使用注册的字体familyName即可
@Entry
@Component
struct registerFont {
@State message: string = 'test'
build() {
Column() {
Text(this.message)
.align(Alignment.Center)
.fontSize(50)
.fontFamily('iconfont')
Text(this.message)
.align(Alignment.Center)
.fontSize(50)
.fontFamily('SF')
}.width('100%')
}
}
更多关于HarmonyOS 鸿蒙Next 全局支持iconfont字体图标的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
HarmonyOS鸿蒙Next全局支持iconfont字体图标,这意味着开发者可以在应用中使用iconfont字体图标,而无需依赖图片资源。iconfont字体图标具有矢量特性,可以无损缩放,且文件体积较小,适合在多种设备上使用。鸿蒙Next通过系统级的支持,使得iconfont字体图标可以在应用的各个界面中统一使用,提升开发效率和用户体验。开发者可以通过鸿蒙提供的API,轻松地将iconfont字体图标集成到应用中,并实现动态调整图标大小、颜色等属性。
HarmonyOS Next 全面支持 iconfont 字体图标,开发者可通过 @ohos.font
模块加载自定义字体文件,并在布局文件中使用 Text
组件显示图标。具体步骤包括:将字体文件放入 resources/base/font
目录,在 config.json
中声明字体资源,然后在代码中通过 fontFamily
属性引用。这种方式简化了图标管理,提升了应用性能,同时支持矢量图标的缩放和颜色自定义,增强了 UI 设计的灵活性。