【HM】ArkUI 元素的样式可以通过@Extend扩展为公共样式，供更多的元素使用，减少代码量

类似抽象封装函数/方法一样，在function关键字前面加上@Extend扩展装饰器。

Column() {
// 按钮1和按钮2有相同的样式
Button('按钮1')
  .fontSize(15)
  .height(40)
  .layoutWeight(1)
  .fontColor('#17A98E')
  .backgroundColor('#00000000')

Button('按钮2')
  .fontSize(15)
  .height(40)
  .layoutWeight(1)
  .fontColor('#17A98E')
  .backgroundColor('#00000000')
}

// 把相同样式抽离出来，通过@Extend扩展一个公共的样式函数：

@Extend(Button) function btnStyle() {
  .fontSize(15)
  .height(40)
  .layoutWeight(1)
  .fontColor('#17A98E')
  .backgroundColor('#00000000')
}

// 按钮1和按钮2的样式表达式可以简化为：

Button('按钮1')
  .btnStyle()

Button('按钮2')
  .btnStyle()