OpenHarmony按钮怎么用

在 OpenHarmony（ArkUI） 里，“按钮”最常见的是 Button 组件。下面从 ArkTS（推荐） 角度给你讲怎么用。

一、最基础的按钮

import { Button, Text } from '@kit.ArkUI'

@Entry
@Component
struct Index {
  build() {
    Column() {
      Button('点击我')
        .onClick(() => {
          console.info('按钮被点击了')
        })
    }
  }
}

二、按钮类型（ButtonType）

Button('普通按钮', { type: ButtonType.Normal })
Button('圆角按钮', { type: ButtonType.Capsule })
Button('圆形按钮', { type: ButtonType.Circle })

常见类型：

• Normal：矩形
• Capsule：胶囊形（最常用）
• Circle：圆形

三、按钮点击事件

Button('提交')
  .onClick(() => {
    // 处理点击逻辑
  })

如果是带参数的：

Button('删除')
  .onClick((event) => {
    console.info('event:', event)
  })

四、按钮样式设置

1️⃣ 设置宽高

Button('按钮')
  .width(200)
  .height(50)

2️⃣ 背景色 & 文字颜色

Button('蓝色按钮')
  .backgroundColor('#007DFF')
  .fontColor('#FFFFFF')

3️⃣ 圆角

Button('圆角')
  .borderRadius(10)

五、按钮里放图标 / 自定义内容

Button() {
  Row() {
    Image($r('app.media.icon'))
      .width(20)
      .height(20)
    Text('图标按钮')
      .margin({ left: 8 })
  }
}

六、禁用按钮

Button('不可点击')
  .enabled(false)
  .opacity(0.5)

七、状态按钮（按压效果）

Button('按压')
  .stateEffect(true)

八、常见使用场景示例

登录按钮

Button('登录', { type: ButtonType.Capsule })
  .width('80%')
  .height(45)
  .backgroundColor('#007DFF')
  .fontColor('#FFFFFF')
  .onClick(() => {
    // 登录逻辑
  })

九、注意事项（新手常踩坑）

1. 必须用 ArkTS / ArkUI
2. Button 必须放在布局组件里（Column / Row）
3. 点击事件用 .onClick()
4. OpenHarmony ≠ Android，不要用 XML

如果你愿意，我也可以：

• 给你 OpenHarmony 实战小例子
• 对比 Android Button vs OpenHarmony Button
• 讲 eTS / ArkTS 区别

你现在是 OpenHarmony 几？API 几？