【HarmonyOS】鸿蒙开发之Button组件——第3.4章_harmonyos button icon

按钮类型

1. Capsule（默认值）：胶囊类型

 Button("默认样式")
          .height(40)//高度
          .width(90)//宽度
          .backgroundColor('#aabbcc')//背景颜色
1
2
3
4

运行结果:

2. Normal：矩形按钮，无圆角

 Button({type:ButtonType.Normal}){
          Text("自定义样式")
            .fontSize(28)// 设置按钮文字大小
            .fontColor(Color.Blue)
            .padding(10)
        }.borderRadius(8)// 设置圆角，但是没有效果
        .backgroundColor("#aabbcc")
1
2
3
4
5
6
7

运行结果:

3. Circle：圆形按钮

  Button("样式二111",{type:ButtonType.Circle})
          .width(100)
          .backgroundColor('#aabbcc')
1
2
3

运行结果:

自定义样式

实例代码:

Button({type:ButtonType.Normal}){
          Text("自定义样式")
            .fontSize(28)// 设置按钮文字大小
            .fontColor(Color.Blue)
            .padding(10)
        }.borderRadius(8)// 设置圆角，但是没有效果
        .backgroundColor("#aabbcc")

        Text().margin({top:10,bottom:10})

        Button({type:ButtonType.Normal}){
          Row(){
            Image($r("app.media.app_icon"))
              .width(50)
              .margin({right:10})
            Text("样式二")
          }.padding(10)
        }.borderRadius(8)// 设置圆角，但是没有效果
        .backgroundColor("#aabbcc")
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

运行结果:

所有样式展示:

button组件事件介绍

常用事件有:
onClick() 点击事件
onHover() 鼠标指针移动到元素或它的子元素上时发生的事件
onMouse() 鼠标移动事件
onTouch() 触摸时发生的事件
onKeyEvent() 按键时发生的事件
onFocus() 按钮聚焦时发生的事件
onBlur() 按钮失去焦点发生的事件
onAppear() 按钮显示时发生的事件
onDisAppear() 按钮消失发生的事件
…

✨$踩坑不易，还希望各位大佬支持一下$

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Cpp五条/article/detail/275680