終于到了真正動(dòng)手做游戲的時(shí)刻，在這一節(jié)里，我會(huì)帶你從頭開(kāi)始將我們的“太空保衛(wèi)者”按照設(shè)計(jì)方案制作出來(lái)。這一節(jié)里的內(nèi)容會(huì)非常的多，一遍消化不了，可以多讀幾遍。別著急，慢慢來(lái)。

首先，我們要準(zhǔn)備好游戲中需要用到的所有素材。

下方是一張素材的清單：

精靈：

- 太空背景圖

- 游戲的標(biāo)題，這里直接用文本

- 開(kāi)始按鈕

- 戰(zhàn)機(jī)

- 敵機(jī)

- 敵機(jī)爆炸動(dòng)畫(huà)

- 子彈

- 游戲結(jié)束

- 用于記分的數(shù)字

- 遮罩層（用于在游戲結(jié)束時(shí)顯示）

聲音：

- 背景音樂(lè)

- 發(fā)射子彈的聲音

- 敵機(jī)爆炸的聲音

按照清單，我們先將所有的素材都導(dǎo)入到游戲中。

準(zhǔn)備素材

大部分的精靈使用“彩色飛機(jī)大戰(zhàn)”中提供的素材。

使用“積木小Y”中的白色數(shù)字以及基礎(chǔ)文本。

使用“幾何圖形”中的正方形作為遮罩層。

使用“飛機(jī)大戰(zhàn)”中的“子彈射擊”和“敵機(jī)爆炸1”音效。

最后，背景音效我們選用“經(jīng)典飛機(jī)大戰(zhàn)”中的 bgm。

所有的素材選中后，點(diǎn)擊“導(dǎo)入”按鈕，將所有的素材導(dǎo)入到游戲中。

導(dǎo)入后，應(yīng)該是這個(gè)樣子。

當(dāng)前我們其實(shí)還缺少一個(gè)素材，就是“敵機(jī)的爆炸動(dòng)畫(huà)”，因?yàn)楸▌?dòng)畫(huà)是針對(duì)敵機(jī)的，所以這里將爆炸動(dòng)畫(huà)作為一個(gè)敵機(jī)的造型，添加到敵機(jī)的素材中。

在資源管理中選中“敵機(jī)”，然后點(diǎn)擊“編輯造型”按鈕。

選擇從素材庫(kù)里添加。

選擇“彩色飛機(jī)大戰(zhàn)”中的“紅色敵機(jī)-動(dòng)畫(huà)”，然后點(diǎn)擊“導(dǎo)入”按鈕。

這樣敵機(jī)就包含兩個(gè)造型了，一個(gè)是正常狀態(tài)，一個(gè)是爆炸時(shí)的動(dòng)畫(huà)。

到此游戲中需要的所有素材都準(zhǔn)備完畢，讓我們開(kāi)始下一步：劃分場(chǎng)景。

劃分場(chǎng)景

上一節(jié)的設(shè)計(jì)方案中提到，游戲分為兩個(gè)場(chǎng)景：開(kāi)始場(chǎng)景和游戲場(chǎng)景，開(kāi)始場(chǎng)景只負(fù)責(zé)顯示游戲的名字和開(kāi)始按鈕，游戲場(chǎng)景則負(fù)責(zé)處理游戲中的所有內(nèi)容。

游戲中默認(rèn)會(huì)包含一個(gè)場(chǎng)景，讓我們?cè)賱?chuàng)建一個(gè)場(chǎng)景。

點(diǎn)擊場(chǎng)景區(qū)中的“新建場(chǎng)景”按鈕。

場(chǎng)景區(qū)中會(huì)增加一個(gè)新的場(chǎng)景，默認(rèn)名字為“場(chǎng)景2”，我們將其重命名為“開(kāi)始場(chǎng)景”。

接著，我們點(diǎn)擊開(kāi)始場(chǎng)景右上角的三個(gè)點(diǎn)，然后選擇“設(shè)置為主場(chǎng)景”。

你會(huì)發(fā)現(xiàn)，在“開(kāi)始場(chǎng)景”的左上角多了一個(gè)小房子的圖標(biāo)，這個(gè)圖標(biāo)標(biāo)識(shí)了當(dāng)前的場(chǎng)景為主場(chǎng)景。所謂的“主場(chǎng)景”是指進(jìn)入游戲后首先顯示的場(chǎng)景，因?yàn)檫M(jìn)入游戲后我們首先展示“開(kāi)始場(chǎng)景”，所以，這里將“開(kāi)始場(chǎng)景”設(shè)置為“主場(chǎng)景”。

我們將“場(chǎng)景1”重新命名為“游戲場(chǎng)景”，這樣兩個(gè)場(chǎng)景就劃分好了。

下面，我們先從“開(kāi)始場(chǎng)景”著手，布置一下界面。

布置界面

首先，我們將默認(rèn)的藍(lán)色背景替換成太空背景，然后將“基礎(chǔ)文字”和“開(kāi)始”素材直接拖拽到編輯區(qū)中。

布置一下位置，然后調(diào)整一下基礎(chǔ)文字的屬性，這里我們通過(guò)調(diào)整了字體的大小，粗細(xì)和顏色讓它看起來(lái)更像一個(gè)標(biāo)題。

接著，我們實(shí)現(xiàn)一下這個(gè)場(chǎng)景中僅有的一個(gè)邏輯：點(diǎn)擊“開(kāi)始”按鈕，進(jìn)入到“游戲場(chǎng)景”。

選擇“開(kāi)始_1”，然后在積木區(qū)點(diǎn)擊“添加事件”按鈕，選擇“當(dāng)精靈被點(diǎn)擊時(shí)”。

接著，添加“控制”中的“切換場(chǎng)景到游戲場(chǎng)景”積木塊。

看起來(lái)是這樣，當(dāng)我們點(diǎn)擊“開(kāi)始”按鈕后，就會(huì)切換到“游戲場(chǎng)景”了。

你可以點(diǎn)擊預(yù)覽場(chǎng)景，然后點(diǎn)擊“開(kāi)始”按鈕，看一下場(chǎng)景是否能夠切換到“游戲場(chǎng)景”。

接下來(lái)，我們要制作“游戲場(chǎng)景”了，還是先從布置場(chǎng)景開(kāi)始。

如圖，層級(jí)管理中的紅色方框內(nèi)就是需要的所有素材了。背景，戰(zhàn)機(jī)，敵機(jī)，藍(lán)色子彈都是獨(dú)立的部分，接下來(lái)我們會(huì)將正方形，開(kāi)始，GAMEOVER三個(gè)圖層組合起來(lái)，創(chuàng)建一個(gè)游戲結(jié)束頁(yè)面。

依次選中 GAMEOVER，開(kāi)始，正方形三個(gè)圖層（Windows系統(tǒng)按住Ctrl鍵點(diǎn)選，Mac系統(tǒng)按住Command鍵點(diǎn)選），然后點(diǎn)擊這三個(gè)圖層任意右側(cè)的小按鈕，選擇“將選中圖層組成容器”。

在層級(jí)管理中會(huì)生成一個(gè)“容器-1”，然后剛才的三個(gè)圖層出現(xiàn)在容器中，請(qǐng)注意，在素材管理區(qū)中也會(huì)出現(xiàn)一個(gè)“容器-1”的素材。

我們可以直接在編輯區(qū)中對(duì)容器中的各個(gè)圖層進(jìn)行大小和位置的調(diào)整，調(diào)整后的游戲結(jié)束界面看上去是這樣，將“正方形”設(shè)置為黑色半透明的遮罩層，然后在上面顯示“GAME OVER”，以及重新開(kāi)始游戲按鈕。

最后，我們把容器重新起個(gè)名字叫“游戲結(jié)束”，在資源管理器中，右鍵點(diǎn)擊“容器-1”，選擇“重命名”，然后設(shè)置名字為“游戲結(jié)束”。

層級(jí)管理中的容器名字會(huì)自動(dòng)更新為“游戲結(jié)束”。

游戲結(jié)束界面只有在游戲結(jié)束的時(shí)候才會(huì)顯示，正常游戲時(shí)不應(yīng)該顯示出來(lái)，所以，我們要將其隱藏起來(lái)，等到游戲結(jié)束時(shí)，再讓它顯示。

在層級(jí)管理中，右鍵點(diǎn)擊“游戲結(jié)束”，然后選擇“隱藏”。

你會(huì)發(fā)現(xiàn)整個(gè)“游戲結(jié)束”容器變成灰色了，而且在編輯區(qū)中也不見(jiàn)了。它被隱藏起來(lái)了，我們會(huì)在需要的時(shí)候再讓它顯示。

接下來(lái)，我們?cè)诰庉媴^(qū)中調(diào)整一下戰(zhàn)機(jī)，敵機(jī)和子彈的大小，然后將得分放在左上角的位置。這樣，游戲場(chǎng)景就布置好了。

到現(xiàn)在為止，我們已經(jīng)完成了游戲中的所有的可見(jiàn)的部分，接下來(lái)我們就要逐一實(shí)現(xiàn)那些不可見(jiàn)的部分---邏輯。

游戲邏輯

在上一節(jié)中我們分析了游戲場(chǎng)景中主要的幾個(gè)部分：戰(zhàn)機(jī)，敵機(jī)，子彈，得分。接下來(lái)，我們會(huì)一個(gè)一個(gè)的進(jìn)行實(shí)現(xiàn)。

首先，我們先要配置游戲中需要用到的“變量”和“通知”。

如圖，我們新建了兩個(gè)全局變量，一個(gè)用于記錄得分，一個(gè)用于記錄游戲是否結(jié)束，0 表示沒(méi)有結(jié)束，1 表示游戲結(jié)束。新建了一個(gè)“敵機(jī)爆炸”的通知，每當(dāng)敵機(jī)發(fā)生爆炸時(shí)就會(huì)發(fā)送這個(gè)通知，“得分?jǐn)?shù)字”每當(dāng)接收到這個(gè)通知時(shí)，就會(huì)將得分加一。

接著，我們先從戰(zhàn)機(jī)開(kāi)始。戰(zhàn)機(jī)需要添加下面的邏輯：

- 當(dāng)手指點(diǎn)擊戰(zhàn)機(jī)拖拽時(shí)要做出響應(yīng)，戰(zhàn)機(jī)位置跟隨手指移動(dòng)。

- 戰(zhàn)機(jī)碰撞到敵機(jī)時(shí)，則游戲結(jié)束，顯示游戲結(jié)束提示。

選中“戰(zhàn)機(jī)”，為戰(zhàn)機(jī)添加如下的積木塊。

積木塊的邏輯清晰明了，在此就不再做多余的解釋了。

接著，子彈需要處理以下的邏輯：

- 游戲開(kāi)始后就不停的克隆子彈。

- 當(dāng)子彈被“克隆”出來(lái)后，將其位置設(shè)置在戰(zhàn)機(jī)的位置。

- 當(dāng)子彈碰撞到“敵機(jī)”時(shí)，子彈應(yīng)該被銷(xiāo)毀。

選中“藍(lán)色子彈”，為其添加如下的積木塊。

這里注意最上方的積木塊“當(dāng)自己移出全部邊緣”，在這里我們做了刪除處理，即當(dāng)子彈飛出屏幕后，將其刪除。因?yàn)椋谟螒蛑杏行┳訌棝](méi)有擊中敵機(jī)，會(huì)直接向上飛出屏幕，如果我們不將其刪除的話(huà)，它們會(huì)繼續(xù)留在游戲中，雖然我們看不見(jiàn)。當(dāng)這些無(wú)用的子彈累積的越來(lái)越多的時(shí)候，游戲可能就會(huì)變得卡頓。所以，對(duì)于這些飛出屏幕的無(wú)用的子彈，我們直接做刪除處理。

接著，我們?cè)偬幚頂硻C(jī)的邏輯。

- 游戲開(kāi)始后就要每間隔一定的時(shí)間“克隆”敵機(jī)。

- 當(dāng)敵機(jī)被“克隆”出來(lái)后，將位置設(shè)置為屏幕頂端的隨機(jī)位置。

- 當(dāng)子彈碰撞到敵機(jī)時(shí)，敵機(jī)銷(xiāo)毀，并發(fā)送一個(gè)“敵機(jī)銷(xiāo)毀”事件。

選中“敵機(jī)”為其添加如下的積木塊。

這里需要特別注意以下用紅框圈出的積木塊“設(shè)置自己不參與碰撞”，這塊積木的作用是讓敵機(jī)不再參與碰撞，因?yàn)樵谖覀兊挠螒蛑?，敵機(jī)只要被一顆子碰撞到，就會(huì)發(fā)生爆炸，我們只想讓敵機(jī)的爆炸邏輯執(zhí)行一次，即子彈打中敵機(jī)，敵機(jī)發(fā)生爆炸，這個(gè)過(guò)程就應(yīng)該結(jié)束。如果在敵機(jī)與子彈發(fā)生碰撞后，不立即將敵機(jī)的碰撞解除，那么就意味著，如果再有一顆子彈碰撞到敵機(jī)，敵機(jī)就會(huì)再發(fā)生一次爆炸，很顯然，這不是我們期望的結(jié)果。

最后，我們處理得分的邏輯：

- 查看是否有“敵機(jī)銷(xiāo)毀”事件，如果有，就將得分加一

選中“白色數(shù)字”，為其添加如下的積木塊。

似乎還少了一個(gè)背景音樂(lè)，我們就將背景音樂(lè)的積木邏輯放在背景上，選中層級(jí)管理中的“背景”，然后添加如下的積木塊。

所有的邏輯部分都處理完了，在預(yù)覽場(chǎng)景之前，我們?cè)僮鲆稽c(diǎn)兒調(diào)整。

如圖，我們將“敵機(jī)”和“藍(lán)色子彈”的本體移除到界面之外，這樣游戲運(yùn)行之后，就只能看到按照預(yù)定的邏輯出現(xiàn)的克隆體了。

點(diǎn)擊“預(yù)覽場(chǎng)景”看一下效果吧！

看起來(lái)還不錯(cuò)，如果你一步一步的走到了這里，并看到了上方的效果，那么意味著你的第一個(gè)小游戲馬上就要做出來(lái)了。

當(dāng)前的星空背景是固定不動(dòng)的，理論上來(lái)講當(dāng)我們向上移動(dòng)時(shí)，周?chē)木拔锸菓?yīng)該向下移動(dòng)的，下面我們對(duì)游戲的背景進(jìn)行一下簡(jiǎn)單的設(shè)置，讓其具備移動(dòng)的功能。

在圖層區(qū)中選中“背景”，然后在圖層屬性區(qū)中點(diǎn)擊“管理行為”按鈕。

在彈出的“管理行為”頁(yè)面中將“循環(huán)滾動(dòng)”右側(cè)的開(kāi)關(guān)打開(kāi)。

添加完行為后，你會(huì)發(fā)現(xiàn)在圖層屬性區(qū)的下方出現(xiàn)了“循環(huán)滾動(dòng)”的條目。

設(shè)置一下循環(huán)滾動(dòng)，因?yàn)檫@是個(gè)豎屏的游戲，所以平鋪方向選擇“豎向”，然后勾選“自動(dòng)移動(dòng)”。

再次，點(diǎn)擊預(yù)覽場(chǎng)景看一下效果：

背景開(kāi)始向下移動(dòng)了，有在太空中飛行的感覺(jué)了。

試著碰撞一架敵機(jī)，看看游戲結(jié)束的畫(huà)面。

你可能發(fā)現(xiàn)了，當(dāng)你點(diǎn)擊“開(kāi)始”按鈕想要再次進(jìn)行游戲時(shí)，沒(méi)有任何反應(yīng)。下面我們就來(lái)看一下是哪里出了問(wèn)題，并將它解決。

我們選中層級(jí)管理中的“開(kāi)始”按鈕，看一下它的邏輯。

它的邏輯是點(diǎn)擊后，切換到“游戲場(chǎng)景”，這是在“開(kāi)始場(chǎng)景”中我們?yōu)樗砑拥倪壿?，目的是從“開(kāi)始場(chǎng)景”跳轉(zhuǎn)到“游戲場(chǎng)景”，但是這里我們已經(jīng)身在“游戲場(chǎng)景”中了，所以點(diǎn)擊“開(kāi)始”按鈕沒(méi)有任何效果。

我們對(duì)其做一下修改，使用一塊“重啟當(dāng)前場(chǎng)景”的積木，這樣當(dāng)點(diǎn)擊“開(kāi)始”按鈕后，就會(huì)重新啟動(dòng)當(dāng)前的場(chǎng)景了。

最后不要忘了，在重新開(kāi)始游戲后，要將“是否結(jié)束”的全局變量設(shè)置為 0。

再次預(yù)覽一下場(chǎng)景，碰撞一個(gè)敵機(jī)，顯示游戲結(jié)束提示，然后點(diǎn)擊“開(kāi)始”按鈕，游戲再次開(kāi)始了。

現(xiàn)在，將場(chǎng)景切換到“開(kāi)始場(chǎng)景”，選擇“開(kāi)始_1”按鈕，你會(huì)發(fā)現(xiàn)，它的積木邏輯也變成了我們剛才修改的邏輯。

小提示：因?yàn)槲覀冊(cè)凇伴_(kāi)始場(chǎng)景”和“游戲場(chǎng)景”都用的是同一個(gè)“開(kāi)始”精靈素材，所以使用的邏輯也都是相同的，如果想要使用不同的邏輯就需要再創(chuàng)建新的“開(kāi)始”精靈素材，然后為其增加新的邏輯。

我們要重新為“開(kāi)始場(chǎng)景”創(chuàng)建一個(gè)“開(kāi)始”按鈕素材。在素材管理器中右鍵點(diǎn)擊“開(kāi)始”精靈，然后選擇復(fù)制。

這樣就增加了一個(gè)新的“開(kāi)始-1”精靈。

我們修改一下其中的邏輯積木，為了便于區(qū)分將兩個(gè)素材進(jìn)行重命名，一個(gè)為“開(kāi)始-開(kāi)始場(chǎng)景”，另一個(gè)為“開(kāi)始-游戲場(chǎng)景”。

這樣我們就有了兩個(gè)“開(kāi)始”精靈，并且每一個(gè)都帶有自己的積木邏輯了。

最后，我們移除開(kāi)始場(chǎng)景中原有的開(kāi)始按鈕，將新的“開(kāi)始-開(kāi)始場(chǎng)景”素材拖拽進(jìn)來(lái)。

點(diǎn)擊“預(yù)覽場(chǎng)景”，看一下最終的效果：

恭喜，你的第一個(gè)小游戲完成了。

總結(jié)一下：

我們按照“太空保衛(wèi)者”的游戲設(shè)計(jì)方案，將游戲一步一步的做了出來(lái)，如果你之前從未有過(guò)游戲開(kāi)發(fā)經(jīng)驗(yàn)，那么這就是你人生中做出的第一個(gè)游戲了。

祝賀你！

如果你最終沒(méi)有做出預(yù)期的效果，那么你可能需要多讀幾遍，并且按照文中的截圖認(rèn)真比對(duì)看看哪里出了問(wèn)題，如果有看不懂的積木邏輯，那么你可能需要回顧之前所學(xué)的與積木有關(guān)的內(nèi)容。

有任何的疑問(wèn)，歡迎給我留言。另外，如果你覺(jué)得這個(gè)系列教程對(duì)你來(lái)說(shuō)有價(jià)值，歡迎點(diǎn)贊和分享，讓它有機(jī)會(huì)被更多的人看到。

我是會(huì)做游戲也會(huì)教你做游戲的小螞蟻，歡迎關(guān)注我的頭條號(hào)，私信“學(xué)習(xí)資料”，領(lǐng)取全網(wǎng)最全的微信小游戲開(kāi)發(fā)系列原創(chuàng)教程資料。