yinmi_h5_edit/assets/script/edit/sound_item.ts

import { _decorator, AudioClip, AudioSource, Button, Component, Label, Node, Sprite, SpriteFrame } from 'cc';
import { main } from '../main';
import { ClientEvent } from '../clientEvent';
import { config } from '../config';
import { bag_item_data, widget_item_data } from '../../data/data';
import { base_res } from './base_res';
const { ccclass, property } = _decorator;

@ccclass('sound_item')
export class sound_item extends base_res {
    @property(Node) img_icon:Node = null;
    @property(Node) lab_name:Node = null;
    private m_audio_clip:AudioClip = null;
    private m_name:string ="";
    @property(Node) btn_play:Node = null;
    @property(SpriteFrame) sf_pause:SpriteFrame = null;
    @property(SpriteFrame) sf_play:SpriteFrame = null;
    public initView(type:number,data:bag_item_data,name:string,ac:AudioClip){
        this.setData(data)
        this.setType(type)
        this.m_audio_clip = ac;
        this.m_name = name;
        this.lab_name.getComponent(Label).string = name;
        this.init()
    }
    public init(isCanMove:boolean = true){
        if(isCanMove){
            this.btn_play.on(Node.EventType.TOUCH_END,()=>{
                ClientEvent.dispatchEvent(config.Event.PLAY_SOUND,this.m_name)
            })
        }
        ClientEvent.on(config.Event.PLAY_SOUND,this.onPlaySound,this)
        if(isCanMove){
            this.node.on(Node.EventType.MOUSE_DOWN,this.onDragRes.bind(this),this)
        }
    }

    public changeAudio(data:bag_item_data,ac:AudioClip){
        this.m_name = data.name;
        this.setData(data)
        this.setType(config.select_res_btn_type.SOUND_LIST)
        this.m_audio_clip = ac;
        this.lab_name.getComponent(Label).string = this.m_name;
        this.btn_play.off(Node.EventType.TOUCH_END)
        this.btn_play.on(Node.EventType.TOUCH_END,()=>{
            this.onPlaySound(this.m_name)
        })
    }
    
    onDragRes(){
        ClientEvent.dispatchEvent(config.Event.DragRes,this.node)
    }
    protected onDestroy(): void {
        ClientEvent.off(config.Event.PLAY_SOUND,this.onPlaySound,this)
    }

    onPlaySound(name:string){
        if(this.m_name===name){
            if(main.cur_play_audio===name&&main.getAudioSource().playing){
                main.getAudioSource().stop()
                this.btn_play.getComponent(Sprite).spriteFrame = this.sf_pause
                main.cur_play_audio = "";
            }else{
                main.g_audioSource.node.off(AudioSource.EventType.STARTED);
                main.g_audioSource.node.off(AudioSource.EventType.ENDED);
                main.g_audioSource.node.on(AudioSource.EventType.STARTED, this.onAudioStarted, this);
                // Register the ended event callback
                main.g_audioSource.node.on(AudioSource.EventType.ENDED, this.onAudioEnded, this);
                this.btn_play.getComponent(Sprite).spriteFrame = this.sf_play
    
                if (this.m_audio_clip instanceof AudioClip) {
                    main.getAudioSource().clip = this.m_audio_clip;
                    main.getAudioSource().play();
                    main.getAudioSource().volume = 1;
                }
                main.cur_play_audio = name;
            }
      
        }else{
            if(this.btn_play) {
                this.btn_play.getComponent(Sprite).spriteFrame = this.sf_pause
            }
        }
    }

    onAudioStarted(){

    }

    onAudioEnded(){
        if(this.btn_play) {
            this.btn_play.getComponent(Sprite).spriteFrame = this.sf_pause
        }
    }
}