cocos2d-html5 各平台声音播放总结

前端之家收集整理的这篇文章主要介绍了cocos2d-html5 各平台声音播放总结前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

cocos2d-js 采用官方的CocosDesion播放声音

声音资源一部分是mp3,一部分ogg

PC端,谷歌浏览器,播放声音一切正常,但到手机浏览器上声音就不能正常播放了

根据官方文档的音乐支持格式

@H_301_12@ 平台 支持的常见文件格式 备注 Android mp3,mid,oggg,wav 可以播放android.media.MediaPlayer所支持的所有格式 iOS aac,caf,mp3,m4a,70); word-break:normal"> 可以播放AVAudioPlayer所支持的所有格式 Windows mid,70); word-break:normal"> 无

CocosDesion支持的音效格式如下:

oggg,70); word-break:normal"> 对wav的支持不完美 caf,m4a 无
可以播放Cocos2d-iPhone CocosDesion所支持的所有格式
主要原因是各平台格式不一样导致了不能播放

对比了一下音乐格式,主要采用ogg作为主要格式,其他格式作为扩展

mp3 :体积小,音质好

ogg :体积小,免费,音质好

wav:无压缩、体积大

写了个测试程序

  1. var HelloWorldLayer = cc.Layer.extend({
  2. sprite:null,_userCursor:null,ctor:function () {
  3. this._super();
  4. var size = cc.winSize;
  5.  
  6. this.musicDirectory = new Array();
  7. for(var i in music_res)
  8. {
  9. this.musicDirectory.push(music_res[i])
  10. }
  11. this.curMusicIndex = 0;
  12. this.soundDirectory = new Array();
  13. for(var i in sound_res)
  14. {
  15. this.soundDirectory.push(sound_res[i]);
  16. }
  17. this.curSoundIndex = 0;
  18.  
  19. var curMusic = new cc.LabelTTF("当前播放音乐:"+this.musicDirectory[this.curMusicIndex].substr(16),"微软雅黑",20);
  20. curMusic.x = cc.winSize.width / 2;
  21. curMusic.y = cc.winSize.height / 2 + 150;
  22. this.addChild(curMusic);
  23. this.m_curMusicLabel = curMusic;
  24.  
  25. var playMusic = new cc.LabelTTF("播放",18);
  26. var playMusicItem = new cc.MenuItemLabel(playMusic,this.playMusicCallback,this);
  27. playMusicItem.x = cc.winSize.width / 2 - 90;
  28. playMusicItem.y = cc.winSize.height / 2 + 50;
  29.  
  30. var stopMusic = new cc.LabelTTF("停止",18);
  31. var stopMusicItem = new cc.MenuItemLabel(stopMusic,this.stopMusicCallback,this);
  32. stopMusicItem.x = cc.winSize.width / 2 - 30;
  33. stopMusicItem.y = cc.winSize.height / 2 + 50;
  34.  
  35. var prevMusic = new cc.LabelTTF("上一首",18);
  36. var prevMusicItem = new cc.MenuItemLabel(prevMusic,this.prevMusicCallback,this);
  37. prevMusicItem.x = cc.winSize.width / 2 + 30;
  38. prevMusicItem.y = cc.winSize.height / 2 + 50;
  39.  
  40. var nextMusic = new cc.LabelTTF("下一首",18);
  41. var nextMusicItem = new cc.MenuItemLabel(nextMusic,this.nextMusicCallback,this);
  42. nextMusicItem.x = cc.winSize.width / 2 + 90;
  43. nextMusicItem.y = cc.winSize.height / 2 + 50;
  44.  
  45. var curSound = new cc.LabelTTF("当前播放音效:"+this.soundDirectory[this.curSoundIndex].substr(22),20);
  46. curSound.x = cc.winSize.width / 2;
  47. curSound.y = cc.winSize.height / 2 - 50;
  48. this.addChild(curSound);
  49. this.m_curSoundLabel = curSound;
  50.  
  51. var playSound = new cc.LabelTTF("播放",18);
  52. var playSoundItem = new cc.MenuItemLabel(playSound,this.playSoundCallback,this);
  53. playSoundItem.x = cc.winSize.width / 2 - 90;
  54. playSoundItem.y = cc.winSize.height / 2 - 150;
  55.  
  56. var stopSound = new cc.LabelTTF("停止",18);
  57. var stopSoundItem = new cc.MenuItemLabel(stopSound,this.stopSoundCallback,this);
  58. stopSoundItem.x = cc.winSize.width / 2 - 30;
  59. stopSoundItem.y = cc.winSize.height / 2 - 150;
  60.  
  61. var prevSound = new cc.LabelTTF("上一首",18);
  62. var prevSoundItem = new cc.MenuItemLabel(prevSound,this.prevSoundCallback,this);
  63. prevSoundItem.x = cc.winSize.width / 2 + 30;
  64. prevSoundItem.y = cc.winSize.height / 2 - 150;
  65.  
  66. var nextSound = new cc.LabelTTF("下一首",18);
  67. var nextSoundItem = new cc.MenuItemLabel(nextSound,this.nextSoundCallback,this);
  68. nextSoundItem.x = cc.winSize.width / 2 + 90;
  69. nextSoundItem.y = cc.winSize.height / 2 - 150;
  70.  
  71. var menu = new cc.Menu(prevMusicItem,nextMusicItem,playMusicItem,stopMusicItem,prevSoundItem,nextSoundItem,playSoundItem,stopSoundItem);
  72. menu.x = 0;
  73. menu.y = 0;
  74. this.addChild(menu);
  75.  
  76. return true;
  77. },prevMusicCallback:function(sender){
  78. if(this.curMusicIndex == 0)
  79. {
  80. this.curMusicIndex = this.musicDirectory.length-1;
  81. }
  82. else
  83. {
  84. this.curMusicIndex--;
  85. }
  86. cc.audioEngine.playMusic(this.musicDirectory[this.curMusicIndex],false);
  87. this.m_curMusicLabel.setString("当前播放音乐:"+this.musicDirectory[this.curMusicIndex].substr(16));
  88. },nextMusicCallback:function(sender){
  89. this.curMusicIndex++;
  90. if(this.curMusicIndex == this.musicDirectory.length)
  91. {
  92. this.curMusicIndex = 0;
  93. }
  94. cc.audioEngine.playMusic(this.musicDirectory[this.curMusicIndex],playMusicCallback:function(sender){
  95. cc.audioEngine.playMusic(this.musicDirectory[this.curMusicIndex],stopMusicCallback:function(sender){
  96. cc.audioEngine.stopMusic();
  97. this.m_curMusicLabel.setString("音乐播放停止");
  98. },prevSoundCallback:function(sender){
  99. if(this.curSoundIndex == 0)
  100. {
  101. this.curSoundIndex = this.soundDirectory.length-1;
  102. }
  103. else
  104. {
  105. this.curSoundIndex--;
  106. }
  107. cc.audioEngine.playEffect(this.soundDirectory[this.curSoundIndex],false);
  108. this.m_curSoundLabel.setString("当前播放音效:"+this.soundDirectory[this.curSoundIndex].substr(22));
  109. },nextSoundCallback:function(sender){
  110. this.curSoundIndex++;
  111. if(this.curSoundIndex == this.soundDirectory.length)
  112. {
  113. this.curSoundIndex = 0;
  114. }
  115. cc.audioEngine.playEffect(this.soundDirectory[this.curSoundIndex],playSoundCallback:function(sender){
  116. cc.audioEngine.playEffect(this.soundDirectory[this.curSoundIndex],stopSoundCallback:function(sender){
  117. cc.audioEngine.stopEffect();
  118. this.m_curSoundLabel.setString("播放音效停止");
  119. }
  120. });
结果是,除了ios端有一个ogg播放不了,这个音乐播放小程序在各个平台ogg都能正常播放。

但放到我的游戏项目中结果又不一样了

----PC浏览器,音乐音效采用ogg可以正常播放

----安卓端浏览器,音乐音效采用ogg可以正常播放

----IOS端浏览器,音乐无法播放ogg,可以播放mp3, 音效无法播放ogg和mp3,可以播放wav

不过cocosdension如果一种格式不能播放会自动搜寻其他格式,所以背景音乐同目录下放了ogg和mp3两种格式,音效则放了ogg和wav格式,

不能播放问题就解决了,

播放延迟卡顿问题:

如果你的音乐音效没有预加载,第一次播放音乐音效会有延迟,如果文件较大延迟会比较厉害,可以将资源路径添加预加载目录,预加载避免延迟

不过预加载会明显影响游戏加载速度,可能会导致画面卡住,如何取舍看个人了。

ios端浏览器第一次进场景加载音乐不能播放问题:

原因是因为苹果的移动端浏览器不能自动播放音频,只能由用户的触摸(点击)事件触发加载,进游戏时音乐没有播放,苹果定的规则只能遵守了

我的办法是在第一个场景做下判断,如果是手机端的ios浏览器,创建一个顶层的Layer,并添加事件,在触发onTouchBegan时playMusic就行了。

  1. if(cc.sys.isMobile && cc.sys.os === cc.sys.OS_IOS)
  2. {
  3. var musicStartLayer = new cc.Layer();
  4. musicStartLayer.x = 0;
  5. musicStartLayer.y = 0;
  6. this.addChild(musicStartLayer);
  7.  
  8. var listener = cc.EventListener.create({
  9. event: cc.EventListener.TOUCH_ONE_BY_ONE,swallowTouches: false,onTouchBegan: function(touch,event){
  10. if(!self.isFirstTouch)
  11. {
  12. self.isFirstTouch = true;
  13. cc.audioEngine.playMusic("res/music.ogg");
  14. }
  15. return true;
  16. }
  17. });
  18. cc.eventManager.addListener(listener,musicStartLayer);
  19. }

猜你在找的Cocos2d-x相关文章