HarmonyOS4 @Builder装饰器 更轻量的复用UI方式

141 阅读1分钟

@Builder装饰器:自定义构建函数

更轻量的复用UI方式 抽取@Builder复用UI组件

定义的语法: @Builder MyBuilderFunction(){ ... }
使用方法:  this.MyBuilderFunction(){ ... }  //复用了几个,就用this调用几个构建函数

Example

@Build轻量级组件复用.jpg


@Entry
@Component
struct Index {
  @Builder
  MoreBuilder(){
    Row(){
      Text('查看更多')
        .fontColor('14')
        .fontColor('#999')
      Image($r('app.media.ic_public_arrow_right'))
        .width('16')
        .aspectRatio(1)  //设置宽高比
        .fillColor('#999')
    }
  }

  build() {
  //组件中调用
this.MoreBuilder()
  }
  
  

https://developer.harmonyos.com/cn/design/harmonyos-icon/   harmony icon库