本文首發(fā)于微信公眾號(hào)【小螞蟻教你做游戲】，歡迎關(guān)注領(lǐng)取更多學(xué)習(xí)做游戲的原創(chuàng)教程資料，每天學(xué)點(diǎn)兒游戲開(kāi)發(fā)知識(shí)。

嗨！大家好，我是小螞蟻。

【資料圖】

終于要寫(xiě)第三篇教程了，中間拖的時(shí)間有點(diǎn)兒長(zhǎng)，以至于我的好幾位學(xué)員等不及已經(jīng)自己做出來(lái)了。這是一件讓我感到非常高興的事情。一位學(xué)員從零基礎(chǔ)開(kāi)始學(xué)，到最后有一定的能力自己琢磨著把游戲做出來(lái)，這是一件不論是對(duì)學(xué)員來(lái)講，還是對(duì)我來(lái)講都是值得驕傲的事情。因?yàn)樗麄円呀?jīng)掌握了自己學(xué)習(xí)和前進(jìn)的方法，我認(rèn)為這種自發(fā)性的能動(dòng)性是推動(dòng)一個(gè)人自主學(xué)習(xí)或者前進(jìn)的最強(qiáng)大的動(dòng)力。

好了，接下來(lái)讓我們來(lái)看一下這一節(jié)將要學(xué)習(xí)的內(nèi)容。

如圖，在之前的基礎(chǔ)上我們要實(shí)現(xiàn)將拾取的牌放到下面的插槽中，插槽中如果有三張同樣的牌，則將她們消除掉，在這個(gè)過(guò)程中我們還要根據(jù)當(dāng)前要插入的牌，對(duì)其它牌進(jìn)行位置調(diào)整，除此之外，在消除后，也要對(duì)插槽中的牌重新進(jìn)行位置調(diào)整。

理論部分

老規(guī)矩，我們先來(lái)一起搞定理論部分。

如圖，還是先進(jìn)行一下數(shù)據(jù)抽象，每個(gè)不同類型的卡牌都可以使用一個(gè)數(shù)字代替，整個(gè)卡槽中的 7 張卡牌，其實(shí)就等同于下方的 7 個(gè)數(shù)字。

接著，我們來(lái)看一下將卡牌插入卡槽的幾種情況。

第一種情況，如果當(dāng)前卡槽中沒(méi)有與它相同的卡牌，那么就可以將這張卡牌放到隊(duì)伍的最后。

第二種情況，如果當(dāng)前卡槽中有一張與它相同的牌，那么就將這張相同牌的后面的所有的牌（這里只有牌 3）向后移動(dòng)一個(gè)位置，然后把它插入到讓出的這個(gè)位置上。

第三種情況，如果當(dāng)前卡槽中有兩張與它相同的牌，那么就將最后一張相同的牌的后面的所有牌（這里有牌 3 和 牌 1）向后移動(dòng)一個(gè)位置，然后把它插入到讓出的這個(gè)位置上。

這就是這個(gè)游戲中可能出現(xiàn)的三種插牌情況了。如何實(shí)現(xiàn)一張牌的插入，以及其它的牌的位置調(diào)整呢？

假設(shè)當(dāng)前卡槽中有四張牌[5,5,3,1]，現(xiàn)在要往里再插入一張“牌5”，整個(gè)過(guò)程是這樣的：依次檢查每個(gè)位置的牌，如果發(fā)現(xiàn)這個(gè)位置的牌跟要插入的牌一樣，就記錄一下這個(gè)位置，否則的話則跳過(guò)繼續(xù)檢查下一個(gè)，直到檢查完所有卡槽中的牌為止。

這個(gè)過(guò)程結(jié)束后，那個(gè)“標(biāo)記位置”記錄的就是最后一張跟插入卡牌相同的牌的位置，有了這個(gè)“標(biāo)記位置”就相當(dāng)于我們知道了這張牌要插在哪里了，其實(shí)就是“標(biāo)記位置 + 1”的那個(gè)位置上。

那剩余其它牌的位置如何調(diào)整呢？只需要判斷剩余的牌的位置是否大于“標(biāo)記位置”，如果大于的話，就將自己的位置增加 1，看起來(lái)就像是這樣。

這就是卡牌的插入和位置調(diào)整了，接著我們?cè)賮?lái)看一下如何判斷是否需要消除，其實(shí)非常簡(jiǎn)單，看到這里你應(yīng)該也能想到的，只需要判斷這一串?dāng)?shù)字里是否有 3 個(gè)相鄰又相同的數(shù)字，有的話，就滿足消除條件。

如圖，就是針對(duì)于 5 張卡牌的檢查過(guò)程，從前往后，依次的取出一張牌，然后看看它后面有沒(méi)有兩張跟它一樣的牌，有的話就滿足消除條件，沒(méi)有的話，就接著去檢查下一張牌，繼續(xù)這個(gè)過(guò)程，直到檢查完卡槽中的所有牌。

其實(shí)在上圖的例子中，我們只需要檢查完前三張就可以了，因?yàn)榈竭@里就能夠判斷出當(dāng)前滿足消除條件了，在這個(gè)游戲中不可能出現(xiàn)同時(shí)滿足兩個(gè)三消的情況，所以第三張牌之后就不需要檢查了。

在完成了消除之后，還需要針對(duì)剩余的卡牌進(jìn)行一次位置的調(diào)整，根據(jù)我們之前講過(guò)的位置調(diào)整，想一下消除之后的調(diào)整應(yīng)該怎么處理呢？

在進(jìn)行消除的檢查時(shí)，我們可以做一個(gè)記錄，記錄就是排在最后面的那一張要消除的牌的位置，有了這個(gè)“標(biāo)記位置”，剩余的牌只需要判斷自己的位置是否大于這個(gè)“標(biāo)記位置”，如果大于的話，就將自己向前移動(dòng)三個(gè)位置即可。

實(shí)踐部分

好了，以上就是所有的理論基礎(chǔ)了，接下來(lái)，我們就到微信小游戲制作工具中實(shí)現(xiàn)一下吧！

如圖，這里我新增了兩個(gè)資源，一個(gè)是“卡牌槽”用于在下面放置卡牌，另一個(gè)是“插槽卡牌”，這個(gè)精靈用作卡牌槽中的牌，它跟我們之前創(chuàng)建的“卡牌”精靈類似的地方是，都有 10 個(gè)小動(dòng)物頭像造型，而且造型的順序也都是一樣的（為什么要再去創(chuàng)建一個(gè)這樣的“插槽卡牌”呢？我們稍后會(huì)解釋）。

接著，來(lái)看一下新增的幾個(gè)全局變量。

當(dāng)前卡牌的插入位置：記錄新來(lái)的牌要插入的位置。

當(dāng)前卡牌的消除位置：記錄最后的那一張要消除的牌的位置。

當(dāng)前拾取的卡牌類型：記錄當(dāng)前從上方拾取的卡牌的類型。

是否可操作：用于判斷是否可操作，在牌進(jìn)行插入或者消除的過(guò)程中，玩家是不能夠去操作其它牌的。

需要消除出的卡牌類型：滿足消除條件的卡牌的類型。

除此之外，我們還創(chuàng)建了一個(gè)新的列表。

插槽牌的類型列表：卡牌槽中的卡牌的類型列表。

除了變量之外，我們還新建了幾個(gè)通知。

幾個(gè)通知的內(nèi)容直接根據(jù)字面意思理解即可。

接下來(lái)，我們來(lái)看積木邏輯，首先從上方的要拾取的卡牌開(kāi)始，先來(lái)看“卡牌”精靈上的拾取邏輯。

圖中紅線框出的就是我們?cè)谥暗幕A(chǔ)上新增的積木塊，圖中已經(jīng)有了詳細(xì)的解釋，這里就不再贅述了。

上方卡牌拾取完后，接著看這個(gè)被克隆出來(lái)的“插槽卡牌”。

先在“插槽卡牌”上創(chuàng)建幾個(gè)新的局部變量。

位置：記錄自己當(dāng)前在卡牌槽中的位置。

類型：記錄自己的卡牌類型。

迭代：在循環(huán)中用到。

標(biāo)記位置：記錄卡槽中跟自己一樣的牌的位置。

是否是新牌：記錄自己是否是新牌，剛拾取還沒(méi)有進(jìn)入到卡槽中的牌是新牌，進(jìn)入卡槽之后就不再是新牌。

然后看一下“插槽卡牌”上的克隆積木邏輯。

其中的邏輯循環(huán)就是我們?cè)诶碚撝兄v到的檢查過(guò)程，可以對(duì)照著之前的圖好好的理解一下。

在新卡牌插入卡槽之前，向卡槽中的其它的牌發(fā)送了一個(gè)調(diào)整位置的通知，接著，我們繼續(xù)來(lái)看一下卡槽中的其它的牌是如何調(diào)整自己的位置的。

“當(dāng)前卡牌的插入位置”這個(gè)變量中記錄的是新牌插入的位置，卡牌的調(diào)整就是將大于等于這個(gè)位置的舊牌，全部向后移動(dòng)一個(gè)位置，以此來(lái)為新牌騰出一個(gè)空位。

新牌被插入卡槽之后，再來(lái)看一下消除的計(jì)算和處理。我把消除計(jì)算的邏輯放在了“卡牌槽”上，來(lái)看一下“卡牌槽”這個(gè)精靈上。

首先，還是需要?jiǎng)?chuàng)建幾個(gè)局部變量。

迭代1/2: 用于循環(huán)遍歷。

比對(duì)類型：當(dāng)前檢查的卡牌類型。

匹配數(shù)量：當(dāng)前檢查的卡牌類型匹配的數(shù)量。

接著，來(lái)看一下消除計(jì)算的積木邏輯。

其中，較難以理解的一個(gè)是關(guān)于消除的遍歷檢查，這里用了雙重的循環(huán)，另一個(gè)是關(guān)于“標(biāo)記位置”的設(shè)置，為什么“當(dāng)前卡牌的消除位置”設(shè)置的是“迭代2”呢？如果你覺(jué)得難以理解，我的建議是可以在紙上畫(huà)出來(lái)一個(gè)卡牌隊(duì)列，列舉出一組數(shù)字，然后對(duì)照著你舉出的例子來(lái)查看這段積木邏輯。其實(shí)，這整個(gè)過(guò)程你完全可以在一張紙上演繹出來(lái)。

最后，我們?cè)賮?lái)看一下“插槽卡牌”上的消除處理，以及消除后的剩余牌的位置調(diào)整。

這樣這個(gè)從插入到消除的功能就完成啦！至于游戲的結(jié)束和過(guò)關(guān)條件如何判斷，我們把它放在了上方的“消除處理”積木邏輯的最后。判讀條件很簡(jiǎn)單，如果插槽中的 7 個(gè)位置都放滿了卡牌，那么游戲就結(jié)束了；如果當(dāng)前的游戲中不再有剩余的牌了，即“卡牌總數(shù)”變量等于 0 ，那么就證明玩家消除掉了所有的牌，游戲過(guò)關(guān)。

最后說(shuō)一下為什么要再新增加一個(gè)“插槽卡牌”，而不是把“插槽卡牌”中的邏輯都放到原來(lái)的“卡牌”中，這是一種職責(zé)的分離，游戲中的每一個(gè)精靈只需要處理自己的職責(zé)即可，“卡牌”負(fù)責(zé)的是主要是堆疊的布局和拾取，拾取之后它的職責(zé)就結(jié)束了，剩余的如何插入卡槽，如果在卡槽中進(jìn)行位置調(diào)整，如何進(jìn)行刪除等職責(zé)將都由“插槽卡牌”來(lái)處理。

把不同的職責(zé)和功能劃分開(kāi)來(lái)，會(huì)方便我們做計(jì)劃或者開(kāi)發(fā)，因?yàn)槊恳徊糠侄贾回?fù)責(zé)處理自己份內(nèi)的事情，所以你在實(shí)現(xiàn)這部分功能的時(shí)候，就可以更專注啦！

最后，我們?cè)兕A(yù)覽一下整個(gè)游戲吧！

到這里肯定會(huì)有人問(wèn)了，如何獲取示例呀？答案是沒(méi)有示例的獲取方法，如果你想找的是一份類似“羊了個(gè)羊”游戲的源碼，那么網(wǎng)上已經(jīng)有開(kāi)源的源碼了，可以自己去搜索。如果你想要的是學(xué)習(xí)自己動(dòng)手做一個(gè)這樣的游戲，那么相信我，最好的方式就是你自己動(dòng)手做一個(gè)。

只有你自己動(dòng)手做出來(lái)的游戲才是真正屬于你的，否則的話，即使游戲在你手里，它也不屬于你。

歡迎關(guān)注小螞蟻的微信公眾號(hào)【小螞蟻教你做游戲】，學(xué)習(xí)更多游戲開(kāi)發(fā)原創(chuàng)教程。