#鸿蒙通关秘籍# 如何在ArkUI中使用Button组件并对其样式进行定制？

import { Button } from '@ohos.ace.ability';
@Entry
@Component
struct MyComponent {
    build() {
        Column() {
            Button('Click me!')
                .width(200)
                .height(50)
                .onClick(() => {
                    console.log('Button clicked');
                })
        }
    }
}

 .linearGradient({
        angle: 90,
        colors: [[0xff0000, 0.0], [0x0000ff, 0.3], [0xffff00, 1.0]]
      })

Button({type:ButtonType.Normal})

.shadow({
    color: Color.Black,
    offset: Size(0, 2),
    radius: 5
})

.fontColor(Color.White)
.fontSize(20)
.fontWeight(FontWeight.bold)

import Button from '@ohos.arkui/Button';

<Button id="myButton" text="点击我" />

<Button
  id="myButton"
  text="点击我"
  style="background-color: blue; color: white; width: 200px; height: 100px;"/>

.my-button {
  background-color: blue;
  color: white;
  width: 200px;
  height: 100px;
}

<Button id="myButton" text="点击我" class="my-button" />