鸿蒙 ArkUI 之实现 Button 点击效果和声效

// 引入必要的库import { animate } from '@ohos.animation';import media from '@ohos.multimedia.media';
// 定义按钮组件@Entry@Componentstruct ButtonWithEffect {  @State isAnimating: boolean = false;
  build() {    Button('点击我')      .onClick($ => this.handleButtonClick())      .width(200)      .height(50)      .margin({ top: 20 })  }
  // 处理按钮点击事件  handleButtonClick() {    if (!this.isAnimating) {      this.playSound();      this.startAnimation();    }  }
  // 播放声音  playSound() {    let player = media.createAudioPlayer();    player.setAudioEvent(media.AudioEvent.MEDIA_PLAY_COMPLETE, (err, data) => {      if (err.code) {        console.error(`Audio play complete callback error: ${err.code}, ${err.message}`);      }    });    player.setSource('local:///assets/click_sound.mp3'); // 设置声音文件路径    player.prepareToPlay().then(() => {      player.play();    }).catch(err => {      console.error(`Failed to play audio: ${err}`);    });  }
  // 开始动画  startAnimation() {    this.isAnimating = true;    let anim = animate((this.isAnimating) => {      if (this.isAnimating) {        // 颤抖效果可以通过改变按钮的位置或大小实现        // 这里简单示例，改变按钮的透明度        return { opacity: this.isAnimating ? 0.5 : 1.0 };      }    }, 100); // 动画时长100ms
    anim.onEnd(() => {      this.isAnimating = false;    });  }}