![Unity 4.3游戏开发项目实战(C#、JavaScript版本)](https://wfqqreader-1252317822.image.myqcloud.com/cover/700/23370700/b_23370700.jpg)
2.7 爆炸效果
所谓爆炸效果,这里指的是炮弹与陨石碰撞所发生的爆炸效果,以及炮弹与飞机碰撞所发生的爆炸效果。
2.7.1 炮弹与陨石碰撞的爆炸效果
下面讲解如何实现炮弹与陨石碰撞所发生的爆炸效果。
1.设置爆炸图片
爆炸图片位于Image文件夹中,名称为“explosionEnemy”,是一个七帧图像的图片,如图2-87所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0077_0001.jpg?sign=1738816697-MYyOENJtnu3ukWVbNxjgDqsb4UFllupS-0-7924adbdbac6959ac96f65ce5fb1016c)
图2-87 explosionEnemy序列爆炸图片
在默认情况下,该图片的Texture Type设置为Texture,如图2-88所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0078_0001.jpg?sign=1738816697-pQ2HwfaZGI14OcJQVbHFEdtbMvvpKgIl-0-36c186dc3def2e203940665285a4c2b8)
图2-88 默认的图片设置
为了得到原始图片的真实尺寸大小,提高图片的清晰度,这里需要重新设置图片的Texture Type。
在图2-89中,选择Texture Type为Advanced, Non Power of 2为None,最底部的属性Format为Automatic Truecolor,最后单击“Apply”按钮,即可完成新的设置,此时在Preview预览窗口中显示图片原始的尺寸大小为308×49像素。也就是说,对于每帧的爆炸图片,大小为44×49像素。在项目Project窗格中,首先选择prefabs文件夹中的sprite对象,直接拖放该对象到层次Hierarchy窗格中,此时将该对象的名称修改为explosionEnemy;然后将Image文件夹下的explosionEnemy图片,拖放到层次Hierarchy窗格中的explosionEnemy对象之上,设置explosionEnemy对象的Position参数为:X=0, Y=0.5, Z=0; Scale参数为:X=0.88, Y=0.98, Z=1,如图2-90所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0078_0002.jpg?sign=1738816697-ZmBUSzBVha9dOnFEFPMtJmEhHdrYk8SJ-0-41eb2c460ae94f8d6338e34bb3115ac3)
图2-89 设置陨石爆炸图片
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0078_0003.jpg?sign=1738816697-u6IergGqspOMglLeOv34JlDNydqZDXBm-0-4e65b2c90ae7d595a315d6a273ee440b)
图2-90 显示爆炸图片
在图2-90中,整个爆炸图片(包括七帧爆炸图)显示在explosionEnemy对象中,由于七帧序列图片显示在一个大的图片中,爆炸图片看得不太清楚。
为了显示爆炸图片中的每一帧图片,在图2-91中,设置Tiling属性的X=0.143,表示是七张图片之一(1/7);设置Offset属性的X=0,则会显示第一帧爆炸图片。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0079_0001.jpg?sign=1738816697-7OcXTDyHxUho2HI6RwUx5vHNovIw0DVg-0-e7305f9f5060414290a245a71d1d74cf)
图2-91 显示第一帧图片
为了显示指定的第二帧爆炸图片,则需要设置Offset属性的X=0.143,如图2-92所示。依次类推,为了指定的显示第七帧爆炸图片,则需要设置Offset属性的X=0.858。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0079_0002.jpg?sign=1738816697-eCtLu3NJmlRvIOnDSG00IBDXoRgJMQfq-0-7680515e40a409ea6b344c6c028969bc)
图2-92 显示第二帧图片
因此,从上面的实验可以看出:为了显示指定帧数的爆炸图片,可以通过设置Tiling以及Offset属性的X值即可。
2.代码显示爆炸图片
要在代码中显示指定帧数的图片,可以通过renderer.material.mainTextureScale语句设置Tiling属性;可以通过renderer.material.mainTextureOffset语句设置Offset属性。
对于C#开发者来说,选择Script文件夹,在右键出现的快捷菜单中选择“Create”→“C# script”命令,创建一个C#文件,该文件名称为ExplosionController。在ExplosionController.cs中书写实现爆炸动画的代码,见代码2-25。
代码2-25 ExplosionController的C#代码
1: using UnityEngine; 2: using System.Collections; 3: 4: public class ExplosionController : MonoBehaviour 5: { 6: 7: public int index=0; 8: public int frameNumber=7; 9: 10: float frameRate=0; 11: float myTime=0; 12: int myIndex=0; 13: 14: void Start() 15: { 16: frameRate=1.0f/frameNumber; 17: } 18: 19: void Update() 20: { 21: myTime+=Time.deltaTime; 22: myIndex=(int)(myTime*frameNumber); 23: index=myIndex % frameNumber; 24: 25: renderer.material.mainTextureScale=new Vector2(frameRate,1); 26: renderer.material.mainTextureOffset=new Vector2(index*frameRate,0); 27: 28: if(index==frameNumber-1) 29: Destroy(gameObject); 30: } 31:}
在上述C#代码中,第25行、第26行是关键语句,第25行语句设置Tiling属性,该属性是一个2D矢量值;第26行语句设置Offset属性,该属性也是一个2D矢量值。
在Tiling属性中,X=1.0f/frameNumber,也就是每一帧图片的宽度;在Offset属性中,X=index*frameRate,每次偏移一帧图片的宽度,从而显示第一帧、第二帧直到第七帧爆炸图片,从而形成爆炸的动画效果,当显示完毕第七帧图片时(代码第28行),则执行第29行语句,自动删除爆炸效果对象。
代码第21行获得爆炸效果运行的整个累计时间,通过22行将该时间乘以图片的帧数(这里为7),然后将最后的结果整型化,通过执行第23语句,将整型化的数据除以图片的帧数,求其余数,依次获得index的数值分别为0、1、2直到6。
将上述代码拖放到层次Hierarchy窗格中的explosionEnemy对象之上,以便后面运行爆炸效果。
对于JavaScript开发者来说,选择Script文件夹,在右键出现的快捷菜单中选择“Create”→“Javascript” 命令,创建一个JavaScript文件,设置该文件的名称为explosionController.js文件。在explosionController.js中书写实现爆炸动画的代码,见代码2-26。
代码2-26 explosionController的JavaScript代码
1: var index:int=0; 2: var frameNumber:int=7; 3: 4: private var frameRate:float=0; 5: private var myTime:float=0; 6: private var myIndex:int =0; 7: 8: function Start() 9: { 10: frameRate=1.0f/frameNumber; 11: } 12: 13: function Update() 14: { 15: myTime+=Time.deltaTime; 16: myIndex=myTime*frameNumber; 17: index=myIndex%frameNumber; 18: 19: renderer.material.mainTextureScale=new Vector2(frameRate,1); 20: renderer.material.mainTextureOffset=new Vector2(index*frameRate,0); 21: 22: if(index==frameNumber-1) 23: Destroy(gameObject); 24: }
在上述JavaScript代码中,第19行、第20行是关键语句,第19行语句设置Tiling属性,该属性是一个2D矢量值;第20行语句设置Offset属性,该属性也是一个2D矢量值。
在Tiling属性中,X=1.0f/frameNumber,也就是每一帧图片的宽度;在Offset属性中,X=index*frameRate,每次偏移一帧图片的宽度,从而显示第一帧、第二帧直到第七帧爆炸图片,从而形成爆炸的动画效果,当显示完毕第七帧图片时(代码第22行),则执行第23行语句,自动删除爆炸效果对象。
代码第15行获得爆炸效果运行的整个累计时间,通过16行将该时间乘以图片的帧数(这里为7),然后将最后的结果整型化,通过执行第17语句,将整型化的数据除以图片的帧数,求其余数,依次获得index的数值分别为0、1、2直到6。
将上述代码拖放到层次Hierarchy窗格中的explosionEnemy对象之上,以便后面运行爆炸效果。
运行游戏,可以看到:此时会出现爆炸效果的动画,在持续时间大约为1秒之后,就自动销毁了。
3.添加爆炸声音
在项目Project窗格中,选择sound文件夹中的explosionEnemy声音文件,拖放该文件到层次Hierarchy窗格中的explosionEnemy对象之上,这样就可以在实现爆炸效果动画的时候播放爆炸声音了,如图2-93所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0082_0001.jpg?sign=1738816697-LZYBlTZ6TZwPwyujokA4bDwnUTTCgr59-0-4e35544c95755ed311ce93e4271a261c)
图2-93 设置爆炸声音
此时运行游戏,可以看到:会出现爆炸效果的动画,并伴随爆炸的声音,在持续时间大约为1秒之后,就自动销毁了。
4.创建爆炸预制件
前面已经创建了爆炸动画,并添加了爆炸的声音,下面来说明如何创建爆炸预制件,以便炮弹与陨石发生碰撞时调用。
在图2-94中,在层次Hierarchy窗格中,选择已经创建的explosionEnemy对象,直接拖放到prefabs中去,此时就会在prefabs文件夹中创建一个预制件爆炸效果explosionEnemy。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0083_0001.jpg?sign=1738816697-0xGTlaBHpwURMnZlGSKdPY1msIqduxnw-0-6ebd9a2d7fce746b12e86b39deba259d)
图2-94 创建explosionEnemy预制件
2.7.2 飞机与陨石碰撞的爆炸效果
下面讲解如何实现飞机与陨石碰撞所发生的爆炸效果。
1.设置爆炸效果
爆炸图片位于Image文件夹中,名称为“explosionPlayer”,是一个5帧图像的图片,如图2-95所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0083_0002.jpg?sign=1738816697-DzxbNDreMjEZKZrqSVwxu0OEpCcLvxfv-0-fa1b71b58ff0dcd81a80f337ff8bef05)
图2-95 explosionPlayer序列爆炸图片
在默认情况下,该图片的Texture Type设置为Texture,如图2-96所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0084_0001.jpg?sign=1738816697-6aUuQg0ZPguKtcFvOrkmeLnazq6nsJNg-0-a50eab535b1565f9c78e2cb31036a40a)
图2-96 默认的图片设置
为了得到原始图片的真实尺寸大小,提高图片的清晰度,这里需要重新设置图片的Texture Type。
在图2-97中,选择Texture Type为Advanced, Non Power of 2为None,最底部的属性Format为Automatic Truecolor,最后单击“Apply”按钮,即可完成新的设置,此时在Preview预览窗口中显示图片原始的尺寸大小为210×43像素。也就是说,对于每帧的爆炸图片,大小为42×43像素。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0084_0002.jpg?sign=1738816697-CgrfDbGZf451X1El8NNsNVckE6SWfNlF-0-42dec07c9d006fbce0e98a4bd69b0858)
图2-97 设置爆炸序列图片
在项目Project窗格中,首先选择prefabs文件夹中的sprite对象,直接拖放该对象到层次Hierarchy窗格中,此时将该对象的名称修改为explosionPlayer;然后将Image文件夹下的explosionPlayer图片,拖放到层次Hierarchy窗格中的explosionPlayer对象之上,设置explosionPlayer对象的Position参数为:X=1, Y=0.5, Z=0; Scale参数为:X=0.84, Y=0.86, Z=1,如图2-98所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0084_0003.jpg?sign=1738816697-VSMhvXwg0zlLWcn73hHCz7pvoLEZWEqm-0-1ce75724ff6f1b89f44312ad46edccc5)
图2-98 设置爆炸图片
在图2-98中,设置Tiling属性下的X=0.20,表示是五张图片之一(1/5);设置Offset属性的X=0.6,则会显示第四帧爆炸图片。
在图2-99中,对于C#开发者来说,选择项目Project窗格Script文件夹中的ExplosionController.cs代码文件,拖放到层次Hierarchy窗格中的explosionEnemy对象之上,在检视器中设置FrameNumber为数值5,以便后面运行爆炸效果。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0085_0001.jpg?sign=1738816697-qmCDPHLdD5prF58r8KUGp8zX3Ht9JLvx-0-49c0dfea6a1807e0f084efef75078edd)
图2-99 拖放代码ExplosionController.cs
在图2-100中,对于JavaScript开发者来说,选择项目Project窗格Script文件夹中的explosionController.js代码文件,拖放到层次Hierarchy窗格中的explosionEnemy对象之上,在检视器中设置FrameNumber为数值5,以便后面运行爆炸效果。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0085_0002.jpg?sign=1738816697-Fs2ozqy3XqZsaG8h5g5wdr0GFaihfuif-0-c7570d37e6df390c7cb8fb0419035388)
图2-100 拖放代码explosionController.js
运行游戏,可以看到:此时会出现新的爆炸效果的动画,在持续时间大约为1秒之后,就自动销毁了。
2.添加爆炸声音
在项目Project窗格中,选择sound文件夹中的explosionPlayet声音文件,拖放该文件到层次Hierarchy窗格中的explosionPlayer对象之上,这样就可以在实现爆炸效果动画的时候播放爆炸声音了,如图2-101所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0086_0001.jpg?sign=1738816697-WIx1ocrdvmZBZYqAgM0hPkaobawKNRTQ-0-cef0167024539a479cb54cdd66f42fbd)
图2-101 设置爆炸声音
此时运行游戏,可以看到:会出现爆炸效果的动画,并伴随爆炸的声音,在持续时间大约为1秒之后,就自动销毁了。
3.创建爆炸预制件
在图2-102中,在层次Hierarchy窗格中,选择已经创建的explosionPlayer对象,直接拖放到prefabs文件夹中去,此时就会在prefabs文件夹中创建一个预制件爆炸效果explosionPlayer。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0086_0002.jpg?sign=1738816697-3BUip4uhAma8riltBvGV7SckSUWwhw75-0-04dc39d2f2afd6daf2182f3be334bdd3)
图2-102 创建explosionPlayer预制件
2.7.3 实现爆炸效果
要实现炮弹与陨石碰撞所发生的爆炸效果,以及炮弹与飞机碰撞所发生的爆炸效果,就需要在碰撞检测中添加相关代码,调用前面已经制作好的爆炸预制件。
对于C#开发者来说,在RockController.cs中添加相关代码实现爆炸效果,见代码2-27。
代码2-27 RockController的C#代码
1: using UnityEngine; 2: using System.Collections; 3: 4: public class RockController : MonoBehaviour 5: { 6: public float speed=2.0f; 7: public GameObject explosionEnemy; 8: public GameObject explosionPlayer; 9: void Update() 10: { 11: transform.Translate(0, -speed*Time.deltaTime,0); 12: } 13: } 14: 15: function OnTriggerEnter (other : Collider) 16: { 17: if(other.tag=="projectile") 18: { 19: transform.position=new Vector3(Random.Range(-2.1f,2.1f),3.5f,0); 20: Destroy(other.gameObject); 21: Instantiate(explosionEnemy, transform.position, transform.rotation); 22: } 23: 24: if(other.tag=="Player") 25: { 26: Instantiate(explosionPlayer, transform.position, transform.rotation); 27: transform.position=new Vector3(Random.Range(-2.1f,2.1f),3.5f,0); 28: } 29: }
在上述C#代码中,与代码2-23相比较,添加了第7行、第8行语句,用于设置公有的爆炸变量,以便开发者在检视器中关联刚刚完成的2个爆炸效果预制件。
在添加的第21行代码中,通过Instantiate()方法,当炮弹碰撞陨石时,调用炮弹碰撞陨石所发生的爆炸效果。
在添加的第26行代码中,通过Instantiate()方法,当陨石碰撞飞机时,调用陨石碰撞飞机所发生的爆炸效果。
在图2-103中,拖放爆炸预制件explosionEnemy、explosionPlayer到上述代码的变量explosionEnemy、explosionPlayer的右边,以便代码分别调用爆炸预制件。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0088_0001.jpg?sign=1738816697-rx1QfSxqwEIiTjgHYdWP2XGXttz7wpBm-0-88d49ab91752f3499faf2b91656e7875)
图2-103 拖放爆炸预制件
对于JavaScript开发者来说,在rockController.js中添加相关代码实现爆炸效果,见代码2-28。
代码2-28 rockController的JavaScript代码
1: var speed:float=2.0f; 2: var explosionEnemy:GameObject; 3: var explosionPlayer:GameObject; 4: function Update(){ 5: transform.Translate(0, -speed*Time.deltaTime,0); 6: } 7: 8: function OnTriggerEnter (other : Collider) 9: { 10: if(other.tag=="projectile") 11: { 12: transform.position=new Vector3(Random.Range(-2.1f,2.1f),3.5f,0); 13: Destroy(other.gameObject); 14: Instantiate(explosionEnemy, transform.position, transform.rotation); 15: } 16: 17: if(other.tag=="Player") 18: { 19: Instantiate(explosionPlayer, transform.position, transform.rotation); 20: transform.position=new Vector3(Random.Range(-2.1f,2.1f),3.5f,0); 21: } 22: }
在上述JavaScript代码中,与代码2-24相比较,添加了第2行、第3行语句,用于设置公有的爆炸变量,以便开发者在检视器中关联刚刚完成的2个爆炸效果预制件。
在添加的第14行代码中,通过Instantiate()方法,当炮弹碰撞陨石时,调用炮弹碰撞陨石所发生的爆炸效果。
在添加的第20行代码中,通过Instantiate()方法,当陨石碰撞飞机时,调用陨石碰撞飞机所发生的爆炸效果。
在图2-104中,拖放爆炸预制件explosionEnemy、explosionPlayer到上述代码的变量explosionEnemy、explosionPlayer的右边,以便代码分别调用爆炸预制件。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0089_0001.jpg?sign=1738816697-9N0YDXRUaZwku19k8gMiJ0XQ4M78VySJ-0-24e636e74d2e68f2c8a35b43b3597095)
图2-104 拖放爆炸预制件
运行游戏,当炮弹击中陨石时,陨石消失,并发生爆炸,如图2-105所示;当陨石砸中飞机时,陨石消失,同样发生爆炸,如图2-106所示。
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0089_0002.jpg?sign=1738816697-HJGrdUqz21UcXWHPMsjKr5un8ECy8pTY-0-de3039cd40369eff6e7547a0de7a42e7)
图2-105 炮弹击中陨石的爆炸
![](https://epubservercos.yuewen.com/E586E6/11989104003033406/epubprivate/OEBPS/Images/figure_0089_0003.jpg?sign=1738816697-rPKHrxIH8XChFv9spBEQOW6ifLuWqwWM-0-18b8ed63bd976bd055e8ba4e5fa312bc)
图2-106 陨石砸中飞机的爆炸