【鸿蒙实战开发】基于Text的自定义字体

场景一:应用设置三方字体。

方案

⦁ 在pages的同级目录下创建font目录。
⦁ 将已有的ttf文件放入font目录中(或者直接放置在rewfile目录下)。
⦁ 在EntryAbility.ets文件的windowStage.loadContent函数中,通过调用font.registerFont方法注册全局的自定义字体。
⦁ 注册完成后在所需页面的Text组件上使用fontFamily属性即可。

核心代码

在windowStage.loadContent中进行字体的注册(可通过font.registerFont进行注册),这样注册完成后,整个应用内都可以使用。

onWindowStageCreate(windowStage: window.WindowStage): void { 
  // Main window is created, set main page for this ability 
  hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate'); 
  windowStage.loadContent('pages/Index', (err) => { 
  font.registerFont({ 
    familyName:'roundFont', 
    familySrc:'/font/AlimamaFangYuanTiVF-Thin.ttf' 
  }) 
  if (err.code) { 
  hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? ''); 
  return; 
} 
hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.'); 
}); 
}

在需要的页面进行使用即可。

@Entry 
@Component 
struct GlobalFont { 
  @State imageUrl: string = 'xxxxx' 
  @State bgColor: string = "#ffffff" 
  @State topSafeHeight: number = 0 
  @State checkedIndex: number = 0 
  private swiperController: SwiperController = new SwiperController() 
  build() { 
    Column() { 
      Stack() { 
        Image(this.imageUrl) 
          .draggable(false) 
          .width("100%") 
          .height('100%') 
        // 使用注册自定义字体 
        Text('氛围感') 
          .fontFamily('roundFont') 
          .fontColor('#ffffff') 
          .fontSize(30) 
          .fontWeight(FontWeight.Bold) 
   
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值