如何用CocosCreator實現(xiàn)射擊小游戲
分析下制作步驟:
1. 準備好資源,搭建場景
資源的話可以自己到網(wǎng)上找,也可以直接用我的也行;創(chuàng)建好相應文件夾,把資源放到res文件夾下;
搭建場景:
第一步:創(chuàng)建一個單色精靈(Script) bg 背景, 設置好顏色,加一個Widget組件,使其充滿屏幕;

第二步: 在bg節(jié)點下創(chuàng)建top和button空節(jié)點作為頂與底部,然后在兩個空節(jié)點加入帶刺的節(jié)點(直接將圖片拖到top層級管理器就可以),現(xiàn)在我們需要給top與button節(jié)點添加一個Layout組件,屬性設置如圖,這樣可以看到屏幕上下都有刺了。

第三步: 將玩家小人、子彈、敵機同樣的方法加入到場景中,再創(chuàng)建一個Label節(jié)點用來顯示分數(shù),調(diào)節(jié)一下位置;

2. 代碼控制游戲
第一步: 創(chuàng)建一個game腳本,掛載到dg節(jié)點上;
第二步: 編輯代碼,在 properties添加屬性,用來關聯(lián)玩家、子彈、敵人節(jié)點,再編輯器關聯(lián);

第三步: 代碼邏輯控制,包括初始化玩家、子彈、敵人;注冊監(jiān)聽事件;寫動作函數(shù);計分判斷等;
全部代碼:
cc.Class({
extends: cc.Component,
properties: {
playerNode: cc.Node,
enemyNode: cc.Node,
fireNode: cc.Node,
scoreNode: cc.Label,
},
onLoad () {
this.playLoad();
this.fireLoad();
this.enemyLoad();
this.node.on("touchstart",this.fire,this);
},
update (dt) {
if(Math.abs(this.fireNode.y-this.enemyNode.y)<(this.fireNode.height/3+this.enemyNode.height/3)
&&Math.abs(this.fireNode.x-this.enemyNode.x)<(this.fireNode.width/3+this.enemyNode.width/3)){
console.log("擊敗敵機");
this.scoreNode.string= ++this.score;//擊中得分
this.fireNode.stopAction(this.fireAction);
this.enemyNode.stopAction(this.enemyAction);
this.enemyNode.active=false;
this.fireNode.active=false;
this.fireLoad();//初始化子彈
this.enemyLoad();// 初始化敵機
}
},
// 關閉事件監(jiān)聽
onDestroy(){
this.node.off("touchstart",this.fire,this);
},
// 初始玩家
playLoad(){
this.score=0;
this.playerNode.y=-cc.winSize.height/4;
},
//初始化子彈
fireLoad(){
this.fireNode.active=true;
this.isFire=false;
this.fireNode.x=this.playerNode.x;
this.fireNode.y=this.playerNode.y+this.playerNode.height;
},
// 初始化敵機
enemyLoad(){
this.enemyNode.active=true;
this.enemyNode.x=Math.random()* cc.winSize.width;
this.enemyNode.y=cc.winSize.height/3;
let x=cc.winSize.width/2-this.enemyNode.width/2;
let y=Math.random()* cc.winSize.height/4;
let seq=cc.repeatForever(cc.sequence(cc.moveTo(1.5,cc.v2(-x,y)),cc.moveTo(1.5,cc.v2(x,y))));
this.enemyAction=this.enemyNode.runAction(seq);
},
// 死亡 重新加載游戲
dear(){
console.log("死亡");
cc.director.loadScene("game_scenes");
},
// 發(fā)射子彈
fire(){
if(this.isFire) return;
this.isFire=true;
console.log("開始發(fā)射");
var fireaction=cc.sequence(
cc.moveTo(1,cc.v2(this.playerNode.x,cc.winSize.height/2)),
cc.callFunc(()=>{
this.dear();
}));
this.fireAction=this.fireNode.runAction(fireaction);
console.log("結束發(fā)射");
}
});
最終效果

以上就是如何用CocosCreator實現(xiàn)射擊小游戲的詳細內(nèi)容,更多關于CocosCreator實現(xiàn)射擊小游戲的資料請關注腳本之家其它相關文章!
- 詳解cocoscreater預制體prefab
- 如何在CocosCreator中利用常駐節(jié)點做圖層管理
- 游戲開發(fā)中如何使用CocosCreator進行音效處理
- CocosCreator ScrollView優(yōu)化系列之分幀加載
- 詳解CocosCreator項目結構機制
- 如何使用CocosCreator對象池
- CocosCreator如何實現(xiàn)劃過的位置顯示紋理
- 整理CocosCreator常用知識點
- 全面講解CocosCreator熱更新
- CocosCreator經(jīng)典入門項目之flappybird
- CocosCreator通用框架設計之網(wǎng)絡
- 怎樣在CocosCreator中使用游戲手柄
相關文章
基于cornerstone.js的dicom醫(yī)學影像查看瀏覽功能
這篇文章主要介紹了基于cornerstone.js的dicom醫(yī)學影像查看瀏覽功能,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-07-07
layer.open 子頁面彈出層向父頁面?zhèn)鬏敂?shù)據(jù)的例子
今天小編就為大家分享一篇layer.open 子頁面彈出層向父頁面?zhèn)鬏敂?shù)據(jù)的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
javascript實現(xiàn)狀態(tài)欄文字首尾相接循環(huán)滾動的方法
這篇文章主要介紹了javascript實現(xiàn)狀態(tài)欄文字首尾相接循環(huán)滾動的方法,實例分析了javascript定時函數(shù)及頁面元素屬性操作的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07
移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的介紹與使用技巧
在日常的移動端開發(fā)時,一般都是試用chrome瀏覽器的移動端模式進行開發(fā)和調(diào)試,只有在chrome調(diào)試完成,而最近發(fā)現(xiàn)了一個新的調(diào)試方法,所以這篇文章主要給大家介紹了關于移動端網(wǎng)頁開發(fā)調(diào)試神器Eruda的基本資料,以及其使用的一些技巧,需要的朋友可以參考下。2017-10-10

