鸿蒙os4开发敲木鱼

初次学习harmonyos,对此一知半解,算是勉强实现了,使用的是arkts

主要用到了图片控件,点击事件,音频播放等功能

此app只有一个页面,所以只粘贴该文件的代码以及音频文件的存放位置

import {TitleComponent} from '../view/TitleComponent'
import media from '@ohos.multimedia.media'
import fileIO from '@ohos.fileio'
import common from '@ohos.app.ability.common'
import fs from '@ohos.file.fs'
@Entry
@Component
struct Index {
  content: string = '积攒功德吧'
  @State count:number = 0
  @State imageWidth:number = 180
  private avPlayer
  private playcount


  build() {
    Flex({direction:FlexDirection.Column}){
      TitleComponent({content:this.content})
      Flex({
        justifyContent:FlexAlign.Center,
        alignItems:ItemAlign.Center,
        direction:FlexDirection.Column
      }){
        Image($r("app.media.muyu"))
          .objectFit(ImageFit.Fill)
          .width(this.imageWidth).height("auto")
          .animation({
            duration: 100,
            curve: Curve.FastOutSlowIn,
            iterations: 1,
            playMode: PlayMode.Normal
          })
          .onClick(()=>{
            this.count++
            this.imageWidth = 200
            // this.playcount = 0
            this.avPlayer.play()
            setTimeout(()=>{
              this.imageWidth = 180
            },100)
          })


        Text("功德木鱼").fontSize(25).fontWeight(FontWeight.Bolder).margin({top:15})

        Text("功德 : "+this.count).fontSize(25).fontWeight(FontWeight.Bolder).margin({top:15})
      }
      .margin({top:30})
      // .border({width:1})
      .width("100%")
      .height("60%")
    }
  }

  async getMusic(){
    //文件系统看文档有点迷糊
    let context = getContext(this) as common.UIAbilityContext
    let resourceManager = context.resourceManager
    this.avPlayer = await media.createAVPlayer()
    this.setAVPlayerCallback();
    //各种瞎蒙,才找到了音频文件的位置
    let filePath = await context.resourceManager.getRawFd("muyuyinpin.wav")
    this.avPlayer.fdSrc = filePath

  }

  aboutToAppear(){
    this.getMusic()

  }


  // 注册avplayer回调函数
  setAVPlayerCallback() {
    // seek操作结果回调函数
    this.avPlayer.on('seekDone', (seekDoneTime) => {
      console.info(`*******************AVPlayer seek succeeded, seek time is ${seekDoneTime}`);
    })
    // error回调监听函数,当avPlayer在操作过程中出现错误时调用reset接口触发重置流程
    this.avPlayer.on('error', (err) => {
      console.error(`*******************Invoke avPlayer failed, code is ${err.code}, message is ${err.message}`);
      this.avPlayer.reset(); // 调用reset重置资源，触发idle状态
    })
    // 状态机变化回调函数
    this.avPlayer.on('stateChange', async (state, reason) => {
      switch (state) {
        case 'idle': // 成功调用reset接口后触发该状态机上报
          console.info('*******************AVPlayer state idle called.');
          // this.avPlayer.release(); // 调用release接口销毁实例对象
          break;
        case 'initialized': // avplayer 设置播放源后触发该状态上报
          console.info('*******************AVPlayerstate initialized called.');
          this.avPlayer.prepare().then(() => {
            console.info('*******************AVPlayer prepare succeeded.');
          }, (err) => {
            console.error(`*******************Invoke prepare failed, code is ${err.code}, message is ${err.message}`);
          });
          break;
        case 'prepared': // prepare调用成功后上报该状态机
          console.info('*******************AVPlayer state prepared called.');
          this.avPlayer.play(); // 调用播放接口开始播放
          break;
        case 'playing': // play成功调用后触发该状态机上报
          console.info('*******************AVPlayer state playing called.');
          // if (this.playcount !== 0) {
          //   console.info('*******************AVPlayer start to seek.');
          //   this.avPlayer.seek(this.avPlayer.duration); //seek到音频末尾
          // } else {
          //   this.avPlayer.pause(); // 调用暂停接口暂停播放
          // }
          // this.playcount++;
          break;
        case 'paused': // pause成功调用后触发该状态机上报
          console.info('*******************AVPlayer state paused called.');
          this.avPlayer.play(); // 再次播放接口开始播放
          break;
        case 'completed': // 播放结束后触发该状态机上报
          console.info('*******************AVPlayer state completed called.');
          //this.avPlayer.stop(); //调用播放结束接口
          this.avPlayer.seek(0)
          break;
        case 'stopped': // stop接口成功调用后触发该状态机上报
          console.info('*******************AVPlayer state stopped called.');
          this.avPlayer.reset(); // 调用reset接口初始化avplayer状态
          break;
        case 'released':
          console.info('*******************AVPlayer state released called.');
          break;
        default:
          console.info('*******************AVPlayer state unknown called.');
          break;
      }
    })
  }



}