引言
Cocos Creator?是一個(gè)完整的游戲開(kāi)發(fā)解決方案，包含了 cocos2d-x 引擎的 JavaScript 實(shí)現(xiàn)，以及快速開(kāi)發(fā)游戲所需求的各種圖形界面東西。Cocos Creator 的編輯器完全為引擎定制打造，包含從規(guī)劃、開(kāi)發(fā)、預(yù)覽、調(diào)試到發(fā)布的整個(gè)工作流所需的全功能，該編輯器供給面向規(guī)劃和開(kāi)發(fā)的兩種工作流，供給簡(jiǎn)略順暢的分工合作方法。Cocos Creator 現(xiàn)在支持發(fā)布游戲到 Web、Android 和 iOS，真正實(shí)現(xiàn)一次開(kāi)發(fā)，全渠道工作。Cocos Creator 是以內(nèi)容創(chuàng)作為中心的游戲開(kāi)發(fā)東西，在 Cocos2d-x 基礎(chǔ)上實(shí)現(xiàn)了完全腳本化、組件化和數(shù)據(jù)驅(qū)動(dòng)等特征。
碰撞組件
首先來(lái)看碰撞組件。CocosCreator提供了三種碰撞組件：Box Collider，Circle Collider，Polygon Collider。增添十分簡(jiǎn)單，只需要選中節(jié)點(diǎn)在屬性檢查器中選擇添加組件。
請(qǐng)輸入圖片描述
這里使用的是Box Collider，可以看到節(jié)點(diǎn)周圍多了一個(gè)綠色的框，這就是碰撞體。
請(qǐng)輸入圖片描述
在屬性檢查器中可以看到碰撞體的屬性，選中Editing可以通過(guò)拖動(dòng)對(duì)其大小進(jìn)行修改。
請(qǐng)輸入圖片描述
另外兩種碰撞組件和Box Collider就是形狀區(qū)別。
碰撞腳本控制
下面來(lái)看碰撞的腳本。首先需要開(kāi)啟碰撞檢測(cè)系統(tǒng)和debug繪制接口，默認(rèn)情況下是禁用的。碰撞檢測(cè)系統(tǒng)功能不需要多說(shuō)，debug繪制是用于顯示碰撞組件的碰撞檢測(cè)范圍的。
???? cc.director.getCollisionManager().enabled = true;
???? cc.director.getCollisionManager().enabledDebugDraw = true;
如果希望顯示碰撞組件的包圍盒，可以開(kāi)啟另一個(gè)接口，我沒(méi)有發(fā)現(xiàn)這個(gè)接口的用處。
cc.director.enabledDrawBoundingBox = true;
接下來(lái)看下碰撞系統(tǒng)的回調(diào)函數(shù)，主要有三個(gè)：
碰撞產(chǎn)生時(shí)調(diào)用onCollisionEnter: function (other, self)
碰撞保持時(shí)調(diào)用onCollisionStay: function (other, self)
碰撞結(jié)束時(shí)調(diào)用onCollisionExit: function (other, self)
other是產(chǎn)生碰撞的另一個(gè)碰撞組件，self是產(chǎn)生碰撞的自身的碰撞組件。
示例的具體代碼如下：
cc.Class({
??? extends: cc.Component,
??? properties: {
??????? // foo: {
??????? //??? default: null,
??????? //??? url: cc.Texture2D,? // optional, default is typeof default
??????? //??? serializable: true, // optional, default is true
??????? //??? visible: true,????? // optional, default is true
??????? //??? displayName: 'Foo', // optional
??????? //??? readonly: false,??? // optional, default is false
?????? ?// },
??????? // ...
??? },
??? // use this for initialization
??? onLoad: function () {
??????? cc.director.getCollisionManager().enabled = true;
?????? cc.director.getCollisionManager().enabledDebugDraw = true;
??????? cc.director.getCollisionManager().enabledDrawBoundingBox = true;
??????? this.touchingNumber = 0;
??? },
??? onCollisionEnter: function (other) {
??????? this.node.color = cc.Color.RED;
??????? this.touchingNumber ++;
??????? cc.log(this.touchingNumber);
??? },
??? onCollisionStay: function (other) {
??????? // console.log('on collision stay');
??? },
??? onCollisionExit: function () {
??????? this.touchingNumber --;
??????? cc.log(this.touchingNumber);
??????? if (this.touchingNumber === 0) {
??????????? this.node.color = cc.Color.WHITE;
??????? }
??? }
??? // called every frame, uncomment this function to activate update callback
??? // update: function (dt) {
??? // },
我也創(chuàng)建了個(gè)學(xué)習(xí)交流群 感興趣的朋友可以加下點(diǎn)擊鏈接加入群聊【cocos/unity交流群】
效果如圖：?
碰撞前
碰撞后
