在游戏开拓中,我们常常需要利用音效来营造游戏气氛,因此本文给各人总结下 Cocos Creator 游戏开拓中音效组件的封装和利用。
一、 Cocos Creator 中音频播放基本 1. 基本常识【1】AudioSource 组件官方文档:
【2】cc.audioEngine官方文档:
Cocos Creator 提供两种音频播放方法,AudioEngine 与 AudioSource 都能播放音频,它 们的区别在于 AudioSource 是组件,可以添加加入景中,由编辑器配置。而 AudioEngine 是 引擎提供的纯 API,只能在剧本中举办挪用。
配合点:本质都是处理惩罚 AudioClip 音频资源,需要在 Cocos Creator 编辑器中挂载组件。
小我私家发起利用这个来替换 AudioSource 组件播放声音,接口齐全,测试有效,可以本身 封装一个雷同 AudioSource 组件的脚原来利用。
方法一:利用 AudioSource 组件播放
建设一个空节点,在这个空节点上,添加一个 其他组件 -> AudioSource
在剧本上预设好 AudioSource,而且按照实际需求,完善剧本的对外接口,如下
cc.Class({ properties: { audioSource: { type: cc.AudioSource, default: null }, }, play() { this.audioSource.play(); }, pause() { this.audioSource.pause(); }, });
方法二:利用 AudioEngine 播放
在剧本内界说一个 audioClip 资源工具,如下示例中 properties 工具内。
直接利用 cc.audioEngine.play(audio, loop, volume); 播放。如下示例中 onLoad 中。
cc.Class({ properties: { audio: { default: null, type: cc.AudioClip } }, onLoad() { this.current = cc.audioEngine.play(this.audio, false, 1); }, onDestroy() { cc.audioEngine.stop(this.current); } });
AudioEngine 播放的时候,需要留意这里的传入的是一个完整的 AudioClip 工具(而不 是 url)。所以我们不发起在 play 接口内直接填写音频的 url 地点,而是但愿各人先界说 一个 AudioClip,然后在编辑器内将音频拖拽过来。
2. 常用要领【1】组件 AudioSource
play ( ) 播放音频剪辑。
stop ( ) 遏制当前音频剪辑。
pause ( ) 暂就绪前音频剪辑。
resume ( ) 规复播放。
【2】声音系统 cc.audioEngine
// 配景音乐,轮回
cc.audioEngine.playMusic(source);
cc.audioEngine.stopMusic(source);
// 短音效
cc.audioEngine.playEffect(source);
cc.audioEngine.stopEffect(source);
上面的第一种要领原生平台有许多 Bug,所以我们的游戏都用的第二种要领播放声音。
二、 Cocos Creator 音效打点组件封装 1.建设音效打点类 SoundMgr.tsconst { ccclass, property } = cc._decorator; @ccclass exportdefaultclassSoundMgr { sound_path: string = 'res/sounds/'; // sound 中生存的是音乐的名称和音频工具的 key-value 键值对 sounds: { [key: string]: any } = {}; enabled: boolean = true; music: string = ''; // 单例模式 protectedstatic instance: SoundMgr; publicstatic getInstance(): SoundMgr { if (!this.instance) { this.instance = newSoundMgr(); } returnthis.instance; } // 添加声音资源 addSound(key: string, clip: cc.AudioClip) { this.sounds[key] = clip; } playFx(fxName: string) { if (!this.enabled) return; cc.audioEngine.playEffect(this.sounds[fxName], false); } playMusic(musicName: string) { this.music = musicName; if (!this.enabled) return; cc.audioEngine.playMusic(this.sounds[musicName], true); } stopMusic() { cc.audioEngine.stopMusic(); } setEnabled(enabled: boolean) { this.enabled = enabled; if (this.enabled) { this.playMusic(this.music); } else { cc.audioEngine.stopAll(); } } getEnable() { returnthis.enabled; } }
2. 在初始化的时候加载音频资源通过 Cocos Creator 可视化编辑东西,我们配置游戏场景和资源如下:
因为 sounds 我们是通过代码动态加载,故我们将生存所有声音文件的 sounds 文件夹放 到 resources 文件夹内(如上图)。
然后,新建 GameMgr.ts,挂载到 Canvas 节点上。
onst { ccclass, property } = cc._decorator; importSoundMgrfrom "SoundMgr"; @ccclass exportdefaultclassGameMgrextends cc.Component { loadSounds() { // 留意通过代码动态加载的资源必需放到 resources 文件夹下 cc.loader.loadResDir('sounds', cc.AudioClip, function(err, clips) { console.log("load clips:", clips); if (err) { console.log("err:", err); } for (let i = 0; i SoundMgr.getInstance().addSound(clips[i].name, clips[i]); } }); } onLoad() { this.loadSounds(); console.log("sounds:", SoundMgr.getInstance().sounds); } onPlayClick() { console.log("play"); SoundMgr.getInstance().playMusic('spring_music'); } onPauseClick() { console.log("pause"); SoundMgr.getInstance().stopMusic(); } }