玩法分析

玩家操作一個反映遲鈍卻蹦跳不停地小怪物去觸碰不斷出現(xiàn)的星星恩沽，難以駕馭的加速度將給玩家?guī)砗艽筇魬?zhàn)斋日，和您的小伙伴比一比看誰能拿到更多地星星吧型凳！

創(chuàng)建項目

啟動CocosCreator創(chuàng)建項目，在資源管理器中分類創(chuàng)建資源文件夾以保存不同的資源碍拆。

將項目所使用的音效和紋理分別存放到對應文件夾并規(guī)范化命名逸寓。

創(chuàng)建場景

游戲場景（Scene）是開發(fā)時組織游戲內容的中心居兆，也是呈現(xiàn)給玩家游戲內容的載體。游戲場景中一般會包含以下內容：場景圖片竹伸、文字泥栖、角色、以組件形式附加在場景節(jié)點上的游戲邏輯腳本等佩伤。當玩家運行游戲時聊倔，首先會加載游戲場景晦毙，場景加載后會自動運行所包含組件的游戲腳本生巡，以實現(xiàn)各種開發(fā)者設置的邏輯。

創(chuàng)建游戲主場景

$ vim assets/scene/main.fire

雙擊主場景會在場景編輯器和層級管理器（節(jié)點樹）中打開见妒，打開場景后層級管理器會顯示當前場景中所有節(jié)點及其層級關系孤荣。剛新建的場景中默認只有一個名為Canvas的根節(jié)點，Canvas可以被稱為畫布節(jié)點或渲染根節(jié)點。默認狀態(tài)下盐股，畫布節(jié)點在場景編輯器中以紫色矩形框顯示區(qū)域范圍钱豁。

渲染根節(jié)點

選中Canvas在右側屬性檢查器的Canvas組件屬性中設置畫布適配選項。

Canvas組件屬性

由于提供多分辨率適配一般會將場景中所有負責圖像顯示的節(jié)點都存放在Canvas下面，這樣當作父節(jié)點的Canvas的縮放屬性scale改變時漩仙，所有子節(jié)點圖像也會跟著一起縮放以適應不同屏幕大小搓茬。

設置創(chuàng)景圖像

添加場景背景圖，將資源管理器中texture紋理目錄下的background圖像拖拽到層級管理器Canvas節(jié)點下队他，即添加一個以background為貼圖資源的子節(jié)點卷仑。節(jié)點會自動以貼圖資源的文件名來命名，編輯場景后及時使用快捷鍵Ctrl+S保存麸折。

修改背景尺寸

為了使背景圖片覆蓋整個屏幕系枪，選中背景節(jié)點后點擊主窗口左上角工具欄第四個按鈕矩形變形工具，使用矩形變形工具可任意修改圖像節(jié)點的尺寸磕谅。

矩形變形工具

為了使背景圖能夠覆蓋主流手機整個屏幕私爷，在背景節(jié)點的屬性檢查器的Node節(jié)點屬性組中設置size寬高為1360 x 760。

添加地面

游戲主角在畫面上是在地面上跳躍膊夹，因此需添加地面衬浑。添加方式和背景雷同。需要注意的是在層級管理器中顯示在下方的節(jié)點渲染順序是會上方節(jié)點的后面放刨，也就是說下方節(jié)點會在上方節(jié)點之后繪制工秩。從層級管理器上可以發(fā)現(xiàn)，層級管理器最下方的節(jié)點在場景編輯器中會顯示在最前方进统。另外助币，子節(jié)點永遠會顯示在父節(jié)點前方。因此可以通過調整節(jié)點層級順序來控制圖層顯示順序螟碎。

設置地面寬高為1960x250眉菱，并沿著背景底邊對齊。

地面節(jié)點

添加主角

添加主角到層級管理器掉分，確保位于最下層顯示最前面俭缓。設置主角屬性克伊，修改錨點位置，默認任何節(jié)點的錨點會在節(jié)點中心即(0.5, 0.5)位置华坦，也就是說節(jié)點中心點所在位置就是該節(jié)點的位置愿吹。

主角跳躍時需要控制主角的底部位置來模擬在地面上跳躍的效果，所以需要將主角的錨點在底邊中心即(0, 0.5)惜姐。

主角錨點

到此為止犁跪，場景搭配完畢。

主角腳本

Cocos Creator開發(fā)游戲的核心理念是讓內容生產(chǎn)和功能開發(fā)流暢地并行協(xié)作

創(chuàng)建驅動主角行動的腳本

$ vim assets/script/player.js

Creator中腳本名稱就是組件的名稱歹袁，命名大小寫敏感耘拇，若組件名稱大小寫錯誤會導致無法通過名稱使用組件。

cc.Class({

});

使用全局方法cc.Class()聲明CocosCreator中的類

• cc是Cocos引擎的簡稱也是Cocos引擎的主要命名空間宇攻，引擎代碼中所有的類惫叛、函數(shù)、屬性逞刷、常量都在cc這個命名空間下嘉涌。
• Class()方法是cc模塊下的一個方法，用于聲明CocosCreator中的類夸浅。
• Class()方法的參數(shù)是一個原型對象仑最，在原型對象中以鍵值對形式設定所需參數(shù)類型，即可創(chuàng)建出所需的類帆喇。

創(chuàng)建組件類的結構

cc.Class({
  extends:cc.Component,
  properties:{}
});

自定義組件類繼承自cc.Component類警医，實現(xiàn)繼承后能夠掛載到到場景的節(jié)點上，提供控制節(jié)點的各種功能坯钦。

添加組件屬性

properties: {
    jumpHeight:0,//主角跳躍高度预皇，單位像素。
    jumpDuration:0,//主角跳躍持續(xù)時長婉刀，單位為秒吟温。
    maxSpeed:0,//最大移動速度，單位像素每秒突颊。
    accel:0,//移動加速度鲁豪，單位像素每秒。
    jumpAudio:{type:cc.AudioClip, default:null},//跳躍音效
},

CocosCreator規(guī)定節(jié)點自定義屬性必須寫在properties代碼塊中律秃，自定義屬性規(guī)定主角的移動方式主要包括高度爬橡、時間、速度棒动、加速度這四大屬性糙申，具體的屬性值可使用屬性檢查器設置，換句話說迁客，這種隨時需要調整的屬性都可以放到properties屬性中郭宝。

為節(jié)點添加腳本組件

在層級管理器中選中主角節(jié)點后，在屬性檢查器下點擊添加組件掷漱，選擇用戶腳本組件粘室，選擇player腳本組件，即可為主角節(jié)點添加player組件卜范。

添加腳本

添加組件成功后即可在屬性檢查器中出現(xiàn)player組件以及自定義的屬性衔统，設置主角跳躍高度為200像素，起跳到最高點所需時間0.6秒海雪，最大水平移動速度為400像素每秒锦爵，水平加速度250像素每秒。

屬性設置

實現(xiàn)玩家垂直跳躍

onLoad(){
  //初始化跳躍動作并在當前節(jié)點上執(zhí)行該動作
  this.jumpAction = this.setJumpAction();
  this.node.runAction(this.jumpAction);
},
//設置主角跳躍動作
setJumpAction(){
  //執(zhí)行向上跳躍到最高點
  const jumpUp = cc.moveBy(this.jumpDuration, cc.v2(0, this.jumpHeight)).easing(cc.easeCubicActionOut());
  //從最高點向下跳躍到原點
  const jumpDown = cc.moveBy(this.jumpDuration, cc.v2(0, -this.jumpHeight)).easing(cc.easeCubicActionOut());
  //上下跳躍時播放跳躍音效
  const callback = cc.callFunc(this.playJumpAudio, this);
  //循環(huán)執(zhí)行
  return cc.repeatForever(cc.sequence(jumpUp, jumpDown, callback));
}

onLoad生命周期回調函數(shù)會在場景加載后立即自動執(zhí)行奥裸，一般會將初始化相關的操作和邏輯放入其中险掀。這里首先講循環(huán)跳躍動作傳遞給jumpAction變量，然后調用組件掛載的節(jié)點的runAction方法湾宙，讓主角節(jié)點循環(huán)跳躍樟氢。

當組件加載后腳本首先會執(zhí)行onLoad生命周期回調函數(shù)，在onLoad()回調函數(shù)中實現(xiàn)主角跳躍動作侠鳄，需要了解CocosCreator的動作系統(tǒng)（Action）埠啃，CocosCreator中的動作簡單來說就是節(jié)點的位移、縮放和旋轉伟恶。主角上下跳躍實際上可以分解為兩個動作向上移動和向下移動碴开，然后無限重復這兩個動作。這里需要實現(xiàn)移動和重復兩個操作博秫，需使用cc.moveBy()和cc.repeatForever()方法捉貌。

移動到指定的距離

cc.moveBy(duration, deltaPos, deltaY):ActionInterval

cc.moveBy()方法用于在規(guī)定時間內移動指定的一段距離紧卒，duration參數(shù)是移動消耗的時長，deltaPos參數(shù)是一個Vec2類型（2D向量和坐標）的對象，也可以是一個Number類型的X軸坐標值找筝。當傳入的是一個Number類型是即為X軸坐標，此時就需要填寫第三個參數(shù)deltaY究流。需要注意的是這里的坐標值是相當于節(jié)點當前的坐標位置予跌，而非整個坐標系的絕對位置。

cc.moveBy(this.jumpDuration, cc.v2(0, this.jumpHeight))

cc.moveBy(this.jumpDuration, 0, this.jumpHeight)

cc.moveBy()方法返回值是一個ActionInterval類型的對象蒿叠，ActionInterval表示時間間隔動作類明垢，即動作在一定時間內完成。時間間隔類ActionInterval具有easing()方法市咽，可以讓時間間隔動作呈現(xiàn)一種緩動運動痊银，easing()方法的參數(shù)是一個緩動對象，同時也返回一個ActionInterval時間間隔類對象施绎。

cc.moveBy(this.jumpDuration, 0, this.jumpHeight).easing(cc.easeCubicActionOut());

cc.easeCubicActionOut()方法構建的緩動對象是以EaseCubicInOut按三次函數(shù)緩動進入并退出的動作溯革。

重復上下跳動

cc.repeatForever()函數(shù)用于永遠地重復某個動作贞绳，有限次數(shù)內重復一個動作則使用repeat函數(shù)，由于cc.repeatForever重復執(zhí)行的動作不會停止致稀，因此不能被添加到cc.sequence或cc.spawn函數(shù)中冈闭。

cc.repeatForever(action:FiniteTimeAction):ActionInterval

按順序執(zhí)行動作

cc.sequence()函數(shù)用于按順序執(zhí)行動作，創(chuàng)建的動作將按順序依次運行抖单。

cc.sequence(actionOrActionArray:FiniteTimeAction|FiniteTimeAction[], tempArray:FiniteTimeAction):ActionInterval

執(zhí)行回調函數(shù)

cc.callFunc(selector:function, selectorTarget:object, data:any):ActionInterval

實現(xiàn)玩家移動控制

鍵盤按下開啟加速萎攒，鍵盤抬起關閉加速。

• 鍵盤按下開啟向左或向右加速
• 鍵盤松開關閉向左或向右加速

為了讓玩家能夠通過鍵盤按鍵控制主角按水平移動矛绘，可為主角添加鍵盤輸入耍休，使用鍵盤A鍵和D鍵控制跳躍的方向。

玩家水平左右移動的過程中存在加速度货矮，當開啟方向加速度開關時向左或向右移動時會添加加速度羊精，當關閉方向加速開關時向左或向右移動時會取消加速度。

onLoad(){
  //初始化水平加速度
  this.xSpeed = 0;
  //初始化方向加速開關
  this.accLeft = false;
  this.accRight = false;
  //監(jiān)聽鍵盤按下事件以實現(xiàn)玩家水平移動
  cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
  cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);
},
onDestroy(){
  //取消監(jiān)聽
  cc.systemEvent.off(cc.SystemEvent.EventType.KEY_DOWN, this.onKeyDown, this);
  cc.systemEvent.off(cc.SystemEvent.EventType.KEY_UP, this.onKeyUp, this);
},
//鍵盤按鍵按下 啟用方向加速度開關
onKeyDown(evt){
  switch(evt.keyCode){
    case cc.macro.KEY.a: this.accLeft = true; break;
    case cc.macro.KEY.d: this.accRight = true; break;
  }
}
//鍵盤按鍵抬起 關閉方向加速度開關
onKeyUp(evt){
  switch(evt){
    case cc.macro.KEY.a: this.accLeft = false; break;
    case cc.macro.KEY.d: this.accRight = false; break;
  }
}

Cocos通過systemEvent來監(jiān)聽系統(tǒng)全局事件囚玫，通過向systemEvent注冊鍵盤響應函數(shù)园匹，在函數(shù)中通過switch判斷鍵盤上的A和D鍵是否被按下或松開，若松下就執(zhí)行對應的操作劫灶。

設置主角速度和位置

• 向左加速移動
• 向右加速移動

游戲中根據(jù)鍵盤輸入獲得加速度方向后裸违，需要每幀在update方法中計算主角的速度和位置。

游戲開發(fā)的一個關鍵點是在每一幀渲染前更新物體的行為本昏、狀態(tài)和方位供汛，這些更新操作通常都會放在update這個生命周期回調函數(shù)中。

update(dt){
  //根據(jù)加速度方向設置每幀更新速度
  if(this.accLeft){
    this.xSpeed -= this.accel * dt;//向左加速移動
  }else if(this.accRight){
    this.xSpeed += this.accel * dt;//向右加速移動
  }
  //限制主角速度不能超過最大值
  if(Math.abs(this.xSpeed) > this.maxSpeed){
    this.xSpeed = this.maxSpeed * this.xSpeed / Math.abs(this.xSpeed);
  }
  //根據(jù)當前速度更新主角的X坐標位置
  this.node.x += this.xSpeed * dt;
}

制作星星

星星是主角的目標涌穆，會不斷在場景中消失又出現(xiàn)怔昨。玩家需引導主角去觸碰星星以收集分數(shù)。當主角觸碰到星星時便會顯示宿稀，然后隨機位置重新出現(xiàn)趁舀。

星星在場景中屬于重復出現(xiàn)又消失的節(jié)點，對于這種在節(jié)點樹上重復生成的節(jié)點祝沸，應采用預制資源prefab矮烹，作為動態(tài)生成節(jié)點時所使用的模板。

• 星星隨機地出現(xiàn)在畫布范圍內
• 星星與主角的距離一旦滿足收集范圍則

制作預制資源

從資源管理器中將星星紋理拖到場景中罩锐，無需修改星星節(jié)點的任何屬性奉狈，只需要為其添加一個自定義的腳本組件后，在將星星節(jié)點拖放到資源管理器涩惑，此時會發(fā)現(xiàn)資源管理器會自動生成星星預設資源仁期。

星星腳本組件

星星腳本組件主要實現(xiàn)的操作包括

• 每一幀都判斷星星和主角的距離是否達到收集半徑，若滿足則發(fā)生收集行為。
• 計算星星與主角之間的距離
• 星星被收集時計算得分并銷毀
• 星星收集時會出現(xiàn)漸隱的視覺效果

這些效果的實現(xiàn)僅僅靠單獨的星星組件腳本是不行的跛蛋，需要和其他組件配置實現(xiàn)熬的。

$ vim assets/script/star.js

cc.Class({
    extends: cc.Component,
    properties: {
        //星星和主角之間的距離小于這個數(shù)值時會完成收集
        pickRadius:0,
    }
}

星星組件添加屬性

星星組件只需要一個屬性用來控制主角距離星星多遠時完成收集，在properties中添加pickRadius自定義屬性赊级。

為節(jié)點添加組件

將star.js腳本組件添加到star節(jié)點中押框，設置收集半徑pickRadius屬性值為60像素。

刪除星星節(jié)點

將星星節(jié)點從層級管理器拖拽到資源管理器中的prefab文件夾下此衅，自動生成star.prefab預設資源文件强戴。接下來亭螟，刪除層級管理器中的star節(jié)點挡鞍。后續(xù)修改星星組件可直接雙擊star.prefab預設資源文件即可。

游戲控制

目前準備工作已經(jīng)做完预烙，首先創(chuàng)建了搭建了場景墨微，完成了美術UI設計，接著為主角添加了player.js控制腳本組件扁掸，為星星創(chuàng)建了預設資源star.prefab文件翘县。下面的中心是實現(xiàn)游戲主邏輯，首先添加名為game.js的腳本組件作為游戲主邏輯腳本谴分，將game.js腳本組件添加到場景的渲染節(jié)點Canvas中锈麸，接著在將地面節(jié)點ground、玩家節(jié)點player牺蹄、星星節(jié)點star作為自定義屬性添加到腳本中忘伞，在依次實現(xiàn)生成星星、計算得分沙兰、游戲結束功能氓奈。

$ vim assets/script/player.js

cc.Class({
    extends: cc.Component,
    properties: {
        //星星產(chǎn)生后消失時間的隨機范圍
        minStarDuration:0,
        maxStarDuration:0,
        //星星預制資源
        star:{type:cc.Prefab, default:null},
        //地面節(jié)點用于確定星星生成的高度
        ground:{type:cc.Node, default:null},
        //玩家節(jié)點用于獲取主角彈跳的高度和控制主角行動開關
        player:{type:cc.Node, default:null},
        //得分文本
        scoreLabel:{type:cc.Label, default:null},
        //得分音效
        scoreAudio:{type:cc.AudioClip, default:null}
    }
}

屬性檢查器自定義屬性參數(shù)

例如：在腳本中為自定義屬性除了設置type和default默認值外，還可設置其他參數(shù)鼎天。

star:{
  type:cc.Prefab, 
  default:null
},

為場景渲染節(jié)點Canvas添加game.js游戲主邏輯控制腳本組件

將自定義屬性中的節(jié)點分別設置（拖拽）到屬性檢查器面板對應位置

任意位置隨機生成星星

場景加載后會初始化游戲主邏輯控制腳本game.js并執(zhí)行onLoad生命周期回調函數(shù)怀大，此時需要隨機位置生成星星，生成星星的位置是有一定區(qū)域限制的呀闻，從坐標的角度上看化借，星星的最高點不能超過主角的彈跳最高點，最低點不得超過地面捡多，左右側不得超過屏幕蓖康。

如何使用預設資源生成星星铐炫，需要使用給定模板在場景中生成節(jié)點，并將該節(jié)點添加到Canvas節(jié)點下蒜焊，最后為其設置一個隨機的位置倒信。

onLoad(){
  //隨機生成星星
  this.spawnStar();
},
//隨機生成星星
spawnStar(){
  //使用給定預設資源模板在場景中生成一個新的節(jié)點
  const start = cc.instantiate(this.starPrefab);
  //將新增節(jié)點添加到畫布節(jié)點下
  this.node.addChild(star);
  //為新節(jié)點設置隨機位置
  star.setPosition(this.getPosition());
}

這里涉及到兩個問題，第一個是如何使用預設資源即模板生成節(jié)點泳梆，第二個如何設置隨機位置鳖悠。

使用預設資源生成節(jié)點

const star = cc.instantiate(this.starPrefab);

cc.instantiate方法的作用是克隆指定的任意類型的對象，或從Prefab預設資源實例化出新節(jié)點优妙，返回值為Node節(jié)點或Object對象乘综。

為星星設置隨機坐標位置

節(jié)點X軸位置可根據(jù)屏幕寬度隨機計算得到，節(jié)點y軸坐標可根據(jù)地面高度和主角跳躍的高度隨機計算得到套硼。

//為星星設置隨機坐標位置
getPosition(){
  const x = this.node.width / 2 * (Math.random() - 0.5);
  const y = this.groundY + this.player.getComponent("player").jumpHeight * Math.random() + 50;
  return cc.v2(x, y);
}

獲取地面最高點Y坐標值

this.ground.y是地面錨點的Y坐標卡辰，錨點默認位于地面的中心位置，獲取高點頂點位置還需為加上地面高度的一半邪意。

onLoad(){
  this.groundY = this.ground.y + this.ground.height / 2;
}

獲取玩家的最高點Y坐標值

this.groundY + this.player.getComponent("player").jumpHeight

計算星星的隨機Y軸坐標值

const y = this.groundY + this.player.getComponent("player").jumpHeight * Math.random();

添加主角碰觸收集星星的行為

星星每幀獲取主角節(jié)點的坐標九妈，通過判斷它們之間的距離是否小于可收集距離來執(zhí)行收集行為，這里的問題是雾鬼，如何在星星中獲取主角節(jié)點的引用呢萌朱？由于game腳本組件中保存了player玩家節(jié)點屬性即主角節(jié)點的引用，而且星星是在game腳本中動態(tài)生成的策菜，因此只要在game腳本生成star節(jié)點實例時晶疼，將game組件的實例傳入到star腳本并保存起來即可，之后即可在star腳本中通過this.game.player訪問主角節(jié)點做入。

spawnStar(){
  //...
  //在星星組件上暫存game對象的引用
  star.getComponent("star").game = this;
}

在star腳本組件中每幀判斷星星和主角的距離

$ vim assets/script/star.js

update(dt){
  //每幀判斷星星與主角的距離來執(zhí)行收集行為
  if(this.getDistance() < this.pickedRadis){
    this.onPicked();
    return;
  }
},
//獲取星星和主角之間的距離
getDistance(){
  //獲取主角的坐標
  const playerPosition = this.game.player.getPosition();
  //極端兩點之間的距離
  return this.node.position.sub(playerPosition).mag();
}

計算兩個cc.Vec2矢量坐標的距離時冒晰，首先對兩個坐標做減法，然后求距離竟块。這里使用到兩個函數(shù)cc.Vec2.sub()和cc.Vec2.mag()方法壶运。

• cc.Vec2.sub方法用于坐標向量減法同時返回新的向量
• cc.Vec2.mag方法用于計算向量的長度

實現(xiàn)星星收集

當星星被收集時調用game腳本中的接口生成一個星星，然后在銷毀當前星星節(jié)點浪秘，最后計算得分蒋情。

onPicked(){
  //生成新的星星
  this.game.spawnStar();
  //銷毀當前星星
  this.node.destroy();
  //計算得分
  this.game.gainScore();
}

計算得分并顯示

成功收集星星時會增加得分獎勵的邏輯和顯示

場景中添加得分節(jié)點

游戲開始得分為0，每次成功收集積分加1耸携，顯示積分棵癣，首先需要在場景中添加一個Label節(jié)點，并添加到畫布節(jié)點下夺衍，設置Label節(jié)點位于最下層并命名為score狈谊，設置Label節(jié)點屬性的位置和文字大小。最后將Label節(jié)點添加到game游戲主邏輯腳本屬性的score屬性中。

游戲主邏輯腳本中實現(xiàn)得分邏輯

$ vim assets/script/game.js

properties(){
  //得分文本顯示節(jié)點
  scoreLabel:{type:cc.Label, default:null},
  //得分音效資源
  scoreAudio:{type:cc.AudioClip, default:null}
},
onLoad(){
  //初始化得分值
  this.score = 0;
},
//計算得分
gainScore(){
  //計算得分
  this.score += 1;
  //更新顯示
  this.scoreLabel.string = this.score + "";
  //播放音效
  cc.audioEngine.playEffect(this.scoreAudio, false);
}

失敗判斷

得分可以帶來成就感和補償感能增加興趣河劝，但得分再多不能失敗壁榕，游戲的挑戰(zhàn)和刺激性就不夠，因為沒有成就感赎瞎，游戲帶來體驗之一是成就感牌里，這種成就感是通過不斷地失敗而后成功，才能極大的給玩家?guī)砟撤N幸福感务甥。如何讓玩家在收集星星的過程中失敗呢牡辽？星星是不斷出現(xiàn)和消失的，在出現(xiàn)和消失的時間間隙完成收集則成功加分敞临，否則失敗退出态辛。

為星星添加計時消失的邏輯

設置標準計時器

vim assets/script/game.js

onLoad(){
  //初始化計時器
  this.timer = 0;
},
update(dt){
  //更新計時器
  this.timer += dt;
},
//生成星星
spawnStar(){
  //重置計時器
  this.timer= 0;
}

設置星星消失時間范圍

vim assets/script/game.js

properties:{
  //定義星星產(chǎn)生后消失的時間范圍
  minStarDuration:0,
  maxStarDuration:0,
}
onLoad(){
  //初始化星星消失時間
  this.starDuration = 0;
}
//創(chuàng)建星星
spawnStar(){
  //隨機設置星星消失時間
  this.starDuration = this.minStarDuration + Math.random() * (this.maxStarDuration - this.minStarDuration);
}

游戲結束判斷

vim assets/script/game.js

update(dt){
  //游戲失敗判斷
  if(this.timer > this.starDuration){
    //游戲失敗
    this.gameOver();
    return;
  }
  //更新計時器
  this.timer += dt;
}
//游戲失敗
gameOver(){
  //停止玩家行為
  this.player.stopAllActions();
  //重新加載場景
  cc.director.loadScene("main");
}

為星星增加漸隱效果

$ vim assets/script/star.js

properties(){
  //透明度范圍
  minOpacity:50,
  maxOpacity:255
},
update(dt){
  //根據(jù)計時器更新透明度
  const radio = 1 - this.game.timer / this.game.starDuration;
  this.node.opacity = this.minOpacity + Math.floor(radio * (this.maxOpacity - this.minOpacity));
}