CocosCreator开发合成大西瓜(六)

314 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第6天,点击查看活动详情

上一次,我们说了在相同的水果产生碰撞后生成新的并且比当前大一级的水果。今天我们继续完善。发生碰撞后加一点特效比较好,因此制作一个产生特效的预制体。

1. 制作产生爆炸效果的预制体

(1)新建一个Sprite(精灵),并重命名为node_tx image.png

(2)Sprite Frame 关联对应的图片资源。

image.png

(3)将node_tx 拖动到prefab文件夹,并将Canvas下的node_tx删除。这样产生特效的预制体就完成了。 image.png

2.添加一个产生特效的函数。参数说明pos_block产生特效的位置,block_wh产生特效效果的宽和高。

    createTx(pos_block,block_wh){

        let node_block= instantiate(this.pre_tx) //实例化  

        node_block.parent=this.node

        node_block.width=block_wh

        node_block.height=block_wh

        node_block.getComponent(Sprite).color= new Color(255,0,0,98)

        node_block.setPosition(pos_block)

        tween(node_block)

        .to(0.1,{scale:new Vec3(1,1,1)})

        .delay(0.1)

        .to(0.1,{scale: new Vec3(0,0,0)})

        .removeSelf()

        .start()     }

2. 回到脚本block.ts上,在产生效爆炸的再调用生成特效的函数即可。注意,在block.ts的脚本上调用脚本上game.ts上的函数,要在start()里加上这一句:        this.tsGame = find('Canvas').getComponent('game')。调用时用this.tsGame.xx就可以了。

                let block_wh=this.node.width

                this.tsGame.createTx(this.block_type,pos_self,block_wh)

                this.tsGame.createTx(this.block_type,pos_other,block_wh)  

3. 除了产生画面爆炸效果,是不是加上声音,效果会更好呢?下面就说下如何添加声音的效果。在文件夹assets下新建文件夹sound,并将爆炸效果的音频文件放到sound文件夹下。 image.png

4. 在Canvas下添加AudioSource组件。 image.png   5.定义audio_pz,并且关联到音频资源。

    @property({type:AudioClip})

    audio_pz=null

image.png

6.在脚本game.ts上增加播放爆炸效果的函数     playSound(){

        let audioSource =this.node.getComponent(AudioSource)

             audioSource.playOneShot(this.audio_pz,1)

    }

7. 在脚本block.ts调用产爆炸效果函数后面再调用播放效果的函数。这样产生爆炸效果                 this.tsGame.playSound()

今天就到这里了,主要说了产生碰撞后增加一些爆炸的特效,我们下次再说。可能写的过程中还有很多不好的地方,希望大家能指出来,在此,谢谢大家