CocosCreator零基础制作游戏《极限跳跃》九、为游戏添加声音音效功能
首页 > CocosCreator > 《极限跳跃》    作者:闭眼就天黑   2016年5月30日 0:17 星期一   热度:18829°   百度已收录  
时间:2016-5-30 0:17   热度:18829° 

CocosCreator零基础制作游戏《极限跳跃》九、为游戏添加声音音效功能


游戏的声音很重要,我们在这个游戏中需要加2个音效,一个背景音乐。。。第一个音效在玩家与障碍物碰撞的地方加碰撞音效,第二个在玩家主角坠落到屏幕底部的时候加游戏结束的音效。然后游戏开始的时候加载背景音乐。


我们一开始在MainScene场景中的声音图标节点就是我们用来控制声音的开关。。

首先修改guawileft.js脚本,添加音效资源,在onload设置声音大小。代码:

//guanwileft.js

   properties: {
        
        times: 0,
        // 碰撞音效资源
        pengAudio: {
            default: null,
            url: cc.AudioClip
        },
    },
    // use this for initialization
    onLoad: function () {
        
            this.moveRight();
            cc.audioEngine.setEffectsVolume ( 0.2 );//设置音效声音大小
     
      
    },

同理在guaiwuright.js脚本也是这样添加。。

为障碍物的2个脚本添加好代码后,我们需要修改我们的两个障碍物预制体。绑定音效资源,这里以zhangaiwuleft预制体为例。双击zhangaiwuleft预制体,添加声音资源绑定。如图:

QQ20160530-1@2x.png

zhangaiwuright预制体同理也是这样添加声音。

碰撞音效加载好后,我们为游戏结束加个音效。打开GAME.js脚本。在 properties中添加属性。代码如下:

        // 背景音乐资源
        bgmusic: {
            default: null,
            type: cc.Node
        },
        // 游戏音乐资源
        gameAudio: {
            default: null,
            url: cc.AudioClip
        },
        // 游戏结束音乐资源
        gameOverAudio: {
            default: null,
            url: cc.AudioClip
        },

添加好代码后,我们双击打开MainScene场景开始为属性绑定资源和节点。。如图:

QQ20160530-2@2x.png

可以跑起来测试下我们的声音有没有了。。这就完了吗?当然不是,我们的声音图标还没有用到啊!!

下面为我们的声音图标节点加一个脚本,新建脚本AudioScript.js。代码如下:

//AudioScript.js

cc.Class({
    extends: cc.Component,
    properties: {
        //是否开启音乐  默认开启
        isOpen: true,
        // 游戏音乐资源
        gameAudio: {
            default: null,
            url: cc.AudioClip
        },
        
    },
    // use this for initialization
    onLoad: function () {
        this.isOpen = true;//开启音乐
        cc.audioEngine.playMusic ( this.gameAudio, true );
        
    },
    //检查音乐开启状态
    checkMusic:function(){
        
        return isOpen;
    },
    //获取点击坐标
    setCp:function(pos){
        
        var rec = cc.rectContainsPoint(this.node.getBoundingBoxToWorld(),pos) ;
     
        if(rec){
            //检查音乐开启状态
            //如果音乐开启了则关闭音乐和音效
            if(this.isOpen){
             //if (cc.audioEngine.isMusicPlaying()) {
                cc.audioEngine.pauseMusic();//暂停正在播放音乐
                cc.log("暂停正在播放音乐");
                //this.node.addChild("Texture/menu_music_off.png");
                this.isOpen = false;
                }
            else {
              // cc.log("music is not playing");
              cc.audioEngine.resumeMusic ();//恢复背景音乐
              cc.log("恢复背景音乐");
              this.isOpen = true;
             }
             
        }
    },
    
    // called every frame, uncomment this function to activate update callback
    // update: function (dt) {
        
    // },
});

代码里实现了一个音乐播放的状态,用来给我们判断是否播放了。播放了图标显示声音图标,没有播放显示静音图标。

var rec = cc.rectContainsPoint(this.node.getBoundingBoxToWorld(),pos) ;

此处用来判断声音图标的包围盒和点击坐标的比较,如果为true则表示声音图标被点击到了,如果声音图标被点击则判断当前声音播放状态,并改变状态。声音图标节点显示如图:

QQ20160530-3@2x.png

声音节点绑定好脚本后,我们继续修改GAME.js脚本中的代码,为AudioScript.js中的方法setCp:function(pos)传参数。

首先在顶部添加引用代码,然后在点击事件添加点击的检测方法,然后update实现更新状态。代码如图:

cocoscreator声音系统

QQ20160530-5@2x.png

QQ20160530-6@2x.png


这里我就不贴代码了,大家手打下。。。到此我们的声音系统也添加完毕了。。。对了,还少一点,声音状态切换的时候声音图标也要改变啊。。。这里大家自己解决。。

二维码加载中...
本文作者:闭眼就天黑      文章标题: CocosCreator零基础制作游戏《极限跳跃》九、为游戏添加声音音效功能
本文地址:https://www.byjth.com/jixiantiaoyue/74.html
版权声明:若无注明,本文皆为“闭眼就天黑专栏_技术博客_个人学习总结”原创,转载请保留文章出处。
相关文章

版权所有:《闭眼就天黑专栏_技术博客_个人学习总结》 => 《CocosCreator零基础制作游戏《极限跳跃》九、为游戏添加声音音效功能
本文地址:https://www.byjth.com/jixiantiaoyue/74.html
除非注明,文章均为 《闭眼就天黑专栏_技术博客_个人学习总结》 原创,欢迎转载!转载请注明本文地址,谢谢。

返回顶部    首页    手机版本    版权所有:闭眼就天黑专栏_技术博客_个人学习总结
    站长: 闭眼就天黑    搜索cocos2dx主题 技术支持:闭眼就天黑   皖ICP备14007736号-1  

皖公网安备 34132102000107号

   sitemap