点击音效系统

SoundCtr.ts 复制代码
import { ResLoader } from "../../../cclib/resourcesManager/ResLoader";
import { LoginUser } from "../../global/bridge/LoginUser";
import { PromiseCatcher } from "../../global/errHandler/PromiseCatcher";

class CSoundCtr {
    private _playEffect(url: string) {
        const volume = LoginUser.getVolume();
        if (volume <= 0) {
            return;
        }

        cc.audioEngine.setEffectsVolume(volume / 100);

        const clip = ResLoader.get(url, false) as cc.AudioClip;
        if (clip) {
            cc.audioEngine.playEffect(clip, false);
            return;
        }

        ResLoader.load(url, cc.AudioClip)
            .then(clip => {
                cc.audioEngine.playEffect(clip, false);
            })
            .catch(PromiseCatcher);
    }

    playOpenGEgg() {
        this._playEffect('sounds/goldsmash');
    }

    playOpenDEgg() {
        this._playEffect('sounds/gamsmash');
    }

    playReward() {
        this._playEffect('sounds/reward');
    }

    playClick() {
        this._playEffect('sounds/click');
    }   
}

export const SoundCtr = new CSoundCtr();
  • _playEffect方法load音效并播放,同时根据系统声音设置来调节音量
  • 然后下面不同方法来配置不同的音效
SoundButtonClick.ts 复制代码
import { IKV } from "../../../libs/interface/IKV";
import { SoundCtr } from "./SoundCtr";

const {ccclass, property, menu, executionOrder} = cc._decorator;

export enum ESoundButtonClickType {
    Common = 0,
    None = 1,
    Back = 2,
    Close = 3,
    FirstPay = 4,
    Claim = 5,
}

@ccclass
@menu('GaGa/Com/SoundButtonClick')
@executionOrder(1)
export default class SoundButtonClick extends cc.Component {
    @property({type: cc.Enum(ESoundButtonClickType), tooltip: CC_DEV && '按钮点击声音类型'})
    soundType: ESoundButtonClickType = ESoundButtonClickType.Common;

    owner?: string;

    onLoad() {
        const button = this.getComponent(cc.Button);
        if (!button) {
            return;
        }

        const handler = new cc.Component.EventHandler();
        handler.target = this.node;
        handler.component = 'SoundButtonClick';
        handler.handler = 'play';
        button.clickEvents.push(handler);
    }

    protected onDisable(): void {
    }

    static setClickParam(target: cc.Node, param: IKV) {
        const bc = target?.getComponent(SoundButtonClick);
    }

    /** 播放点击按钮的声音 */
    play() {
        switch(this.soundType) {
            case ESoundButtonClickType.None:
                return;

            case ESoundButtonClickType.Common:
                SoundCtr.playClick();
                break;


        }
    }
}
  • 配置音效类型ESoundButtonClickType,提供给cocos编辑器,直接在编辑器上选择对应种类的音效
  • onLoad里给button添加上方法,使得按钮被点击了就会触发对应的音效
SoundButtonClickManager.ts 复制代码
import SoundButtonClick from "./SoundButtonClick";

const {ccclass, property, menu} = cc._decorator;

@ccclass
@menu('GaGa/Com/SoundButtonClickManager')
export default class SoundButtonClickManager extends cc.Component {
    onLoad() {
        const name = this.node.name;
        const buttons = this.getComponentsInChildren(cc.Button);
        buttons.forEach(button => {
            const comp = button.getComponent(SoundButtonClick) || button.addComponent(SoundButtonClick);
            comp.owner = comp.owner || name;
        });
    }

}
  • 这个方法挂载到canvas下,监控所有的button,这样每个按钮都有了默认的点击音效
相关推荐
JMS_兔子16 分钟前
【面试 · 一】vue大集合
前端·javascript·vue.js
淺黙ベ32 分钟前
✍️【TS类型体操进阶】挑战类型极限,成为类型魔法师!♂️✨
前端·vue.js·typescript·交互
dy17172 小时前
vue3 element-plus 输入框回车跳转页面问题处理
前端·javascript·vue.js
海尔辛2 小时前
学习黑客 shell 脚本
前端·chrome·学习
每天吃饭的羊2 小时前
XSS ..
前端
小李李33 小时前
基于Node.js的Web爬虫: 使用Axios和Cheerio抓取网页数据
前端·爬虫·node.js·跨域
酷小洋3 小时前
CSS基础
前端·css
xinruoqianqiu3 小时前
shell脚本--2
linux·运维·开发语言·前端·c++·chrome
几度泥的菜花4 小时前
Vue 项目中长按保存图片功能实现指南
前端·javascript·vue.js
学习机器不会机器学习4 小时前
什么是跨域,如何解决跨域问题
前端·后端