HarmonyOS 如何全局复用样式

HarmonyOS  如何全局复用样式。

HarmonyOS
2024-09-25 12:11:09
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zbw_apple

目前全局复用样式,可以进行动态属性设置,attributeModifier属性:可以设置组件常规状态样式、按压样式等多个状态样式展示,具体支持组件以及方法可参考以下链接实现:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-attribute-modifier-V5#attributemodifier

//创建Button的通用样式  
class MyButtonModifier implements AttributeModifier<ButtonAttribute> {  
  //正常状态下的样式  
  applyNormalAttribute(instance: ButtonAttribute): void {  
    instance.fontSize(50).fontWeight(FontWeight.Bold).backgroundColor(Color.Red).fontColor(Color.Green)  
  }  
}  
  
//创建Text的通用样式  
class MyTextModifier implements AttributeModifier<TextAttribute> {  
  applyNormalAttribute(instance: TextAttribute): void {  
    instance.fontSize(50).fontColor(Color.White).backgroundColor(Color.Blue).borderRadius(10)  
  }  
  
}  
  
@Entry  
@Component  
struct AttributeModifierPage {  
  @State message: string = 'Hello World';  
  buttonModifier:MyButtonModifier = new MyButtonModifier()  
  textModifier:MyTextModifier = new MyTextModifier()  
  
  build() {  
    Column({space:10}) {  
      Button('按钮一')  
        .attributeModifier(this.buttonModifier)  
  
      Button('按钮二')  
        .attributeModifier(this.buttonModifier)  
  
      Text('文本一')  
        .attributeModifier(this.textModifier)  
  
      Text('文本二')  
        .attributeModifier(this.textModifier)  
  
    }.justifyContent(FlexAlign.Center)  
    .height('100%')  
    .width('100%')  
  }  
}
分享
微博
QQ
微信
回复
2024-09-25 16:51:46
相关问题
HarmonyOS 跨文件复用样式
51浏览 • 1回复 待解决
HarmonyOS 跨文件样式复用
146浏览 • 1回复 待解决
HarmonyOS 全局样式怎么创建?
265浏览 • 1回复 待解决
鸿蒙怎么实现UI控件样式复用
7766浏览 • 3回复 待解决
如何在Shadow DOM中应用全局样式?
160浏览 • 0回复 待解决
多态样式可否导出给全局使用
1677浏览 • 1回复 待解决
HarmonyOS 组件复用问题
342浏览 • 1回复 待解决
HarmonyOS 如何设置全局字体
30浏览 • 1回复 待解决
HarmonyOS 如何定义全局 style ?
356浏览 • 1回复 待解决
HarmonyOS 如何知道组件复用是否生效
514浏览 • 1回复 待解决
HarmonyOS list控件子组件复用
388浏览 • 1回复 待解决