前言

本期視頻點贊目標達成，已經(jīng)把分步拆解的文字版本和視頻版本發(fā)到知識星球（英雄算法聯(lián)盟）里，但是有同學反饋免費體驗券無法查看（其實是需要下載app），如果不想下載app，可以跟著這篇文章進行學習，如果執(zhí)意要在星球里學習，可以嘗試下掃下文末的免費體驗券，注意無需付費?。。?/strong>由于B站文章的代碼格式不支持，所以代碼的部分采用圖片的方式，這樣也可以避免大家復制粘貼，逼著大家自己寫，何嘗不是一種倒逼。

B站不能上傳文件，所以源碼可以在公眾號：夜深人靜寫算法，回復?tetris 直接獲取。

(相關(guān)資料圖)

第01步、安裝編碼環(huán)境

1、下載Python

百度輸入 "Python3下載"，右鍵打開官網(wǎng)，找到一個相對較新的版本，點擊下載，看到 recommended 字樣，不由自主的選擇了這個，右鍵打開，等它下載完。

2、安裝Python

雙擊安裝，不要點取消，安裝完成。

3、下載安裝VSCode

百度輸入 "vscode"，點擊官網(wǎng)，點擊下載，點擊 windows，就下載好了，直接雙擊，咦怎么沒有找到？嘶……哦哦哦哦哦，點擊保留，點擊打開文件，點擊我愿意，下一步，下一步，創(chuàng)建桌面快捷方式，下一步，安裝，完成。

4、第一個Python程序

新建一個文件，選擇Python類型，隨便寫一段代碼，按 F5 運行，調(diào)出來的框選擇確認，安裝Python解釋器，選它，第一個Python程序就出來了。

分步視頻：/117C1FekV

第02步、安裝游戲環(huán)境

找到Python的安裝目錄，右鍵打開命令行，把 pip3 拖進來，緊接著輸入 "install pygame"，看到絢麗的進度條，我的內(nèi)心泛起了漣漪，至此我們的游戲環(huán)境就搭好了。

分步視頻：/11GDpn3TK

第03步、運行例子

按住 shift，右鍵窗口空白處，打開 Power Shell 控制臺，把 Python 的可執(zhí)行文件拖進來，輸入：，按下回車：

分步視頻：/11oPrEMgU

第04步、新建文件夾

接下來我們自己來做一個游戲。右鍵新建文件夾，輸入pic用來放圖片。再新建一個文件夾，輸入code用來放代碼，把老婆給我們準備好的圖片，Ctrl+C, Ctrl+V。

沒有老婆的話可以找女朋友要。在 code 目錄中新建一個文件，選擇Python，Ctrl + S，命名 代表游戲主文件。

分步視頻：/11VH2swXp

第05步、初始化pygame

分步視頻：/11AnfcLzZ

第06步、主循環(huán)

分步視頻：/110jZesoz

第07步、創(chuàng)建畫面

分步視頻：/11rsA6ReC

第08步、顯示圖片

分步視頻：/11CylfiAR

第09步、讓圖片動起來

分步視頻：/11IFaReOB

第10步、去掉殘影

分步視頻：/11sRZuvBa

第11步、控制移動

分步視頻：/1104ZVHvx

第12步、增加上下方向

分步視頻：/111e7uCEM

第13步、實現(xiàn)方塊類

現(xiàn)在只有一個方塊，想要有多個方塊，最好的方法就是把方塊設計成一個類，利用面向?qū)ο蟮乃枷?，接下來我們實現(xiàn)一個方塊類 Block，處理好圖片和它的位置，以及玩家控制的代碼，再封裝一個渲染的函數(shù)，像這樣：

生成一個類的實例，刪掉剛才的測試代碼，調(diào)用更新和渲染的函數(shù)。

分步視頻：/11HVnWQJn

第14步、多實例

1、定義方塊類型

既然已經(jīng)封裝成了類，自然就可以多個實例運行，定義 blockType，紅橙黃綠青藍紫，像這樣：

2、定義方塊資源路徑

每種類型的資源位置寫下來，一氣呵成，沒有技巧，全是感情，唯手熟爾，你也可以：

3、方塊初始化參數(shù)

對 Block 加入初始化參數(shù)，方塊類型和位置，把原有的常量，替換成變量：

4、實例化方塊

生成兩個方塊的實例（也就是對象的意思），像這樣：

5、調(diào)用更新和渲染函數(shù)

調(diào)用方塊的 update 和 draw 函數(shù)。

分步視頻：/11DrHRwC2

第15步、拆分文件

分步視頻：/114prI5hu

第16步、邏輯和表現(xiàn)分離

重新實現(xiàn)block的初始化函數(shù)，可以根據(jù)類型、行坐標、列坐標、寬高，以及相對位置來實現(xiàn)多態(tài)，根據(jù)傳參來確定采用哪張圖片、實際的尺寸、以及確定位置。把之前的初始化函數(shù)刪掉。

分步視頻：/11hSGSoaw

第17步、組合方塊

1、增加方塊配置

在 const 文件中，增加四種形狀的配置，放在 BLOCK_SHAPE 中，用局部坐標來表示，有方形、長條形、z字型、飛機型，像這樣：

2、隨機生成方塊組

然后新建一個文件 ，實現(xiàn)通過配置實例化方塊組的接口，一個blockGroup代表一個方塊組：

3、實例化方塊組

將方塊組存儲在 blocks 列表中，實現(xiàn)渲染函數(shù)，遍歷blocks進行渲染。

分步視頻：/11oUTfLOS

第18步、模擬下落

分步視頻：/11qZF4tvO

第19步、框架代碼

分步視頻：/11HjoTcnd

第20步、確定游戲主邏輯

抽象來說，俄羅斯方塊這個游戲就是：一個靜態(tài)的 BlockGroup 和 一個下落的 BlockGroup完成碰撞的過程，下落的 BlockGroup 在和靜態(tài)的 BlockGroup 產(chǎn)生碰撞以后，就會被合并到靜態(tài)的 BlockGroup 去，而靜態(tài)的 BlockGroup 從下往上判斷。是否有一整行填充的方塊，播放一個消去的動畫，直到找不到整行的為止，則繼續(xù)生成下落的方塊的過程。

當靜態(tài)的 blockGroup 到達一定高度，則游戲失敗。

分步視頻：/1106GAXIK

第21步、BlockGroup 的多態(tài)

1、增加 BlockGroup 類型

在 文件中添加兩種類型，一種是靜態(tài)的，一種是下落的：

2、定義方塊寬高

方塊的寬高定義成常量，都是32像這樣。

3、初始化 BlockGroup

給每個方塊組加上類型，像這樣：

4、下落調(diào)整

如果類型是下落類型，才執(zhí)行時間判定。

5、游戲邏輯調(diào)整

在 game 文件中，將 固定類型方塊組 fixedBlockGroup 以及 下落類型方塊組 dropBlockGroup 都實例化出來，update 函數(shù)就是執(zhí)行兩者的 update，并且如果沒有下落類型，則隨機生成一個。渲染函數(shù)也是類似寫就可以了。

分步視頻：/11uqzAUGW

第22步、模擬碰撞

1、碰撞的概念

在這個場景下，碰撞的概念其實就是：計算固定的 blockGroup 和 下落的 blockGroup 的交集，如果兩個方塊集合才產(chǎn)生交集，則認為發(fā)生了碰撞。

2、block 坐標封裝

對每個 block 實現(xiàn) 獲取當前坐標 和 獲取下落后的坐標 的函數(shù)，像這樣：

3、blockGroup 坐標封裝

在 blockGroup 中用列表進行一次封裝，像這樣：

4、blockGroup 增刪改接口

再實現(xiàn)一些增刪改的函數(shù)，以便不時之需：

5、碰撞檢測

在 文件中，實現(xiàn)碰撞檢測，首先將固定的 ?blockGroup 中所有的方塊映射到 哈希表中，然后取下落的 blockGroup 中所有方塊，下落后的位置，去哈希表中進行查詢，一旦找到，這個函數(shù)返回 True；否則如果超過游戲給定的行數(shù)，也返回 True，都代表產(chǎn)生了碰撞。

分步視頻：/11XOLtzAE

第23步、控制左右移動

1、左右移動接口

將之前 block 中控制方塊移動的代碼去掉，定義一些邊界值以及控制方塊左右移動時需要修改的變量，比如左邊界判定，右邊界判定，方塊左移和方塊右移。

2、左右移動按鍵響應

然后在blockGroup 中實現(xiàn)左右移動。如果方塊組中有任意一個方塊在左邊界，則無法左移，否則可以，直接執(zhí)行；如果方塊組中有任意一個方塊在右邊界，則無法右移，否則可以。

3、按鍵調(diào)用

在 blockGroup 的 update 函數(shù)中，調(diào)用按鍵相應接口，像這樣：

分步視頻：/11ypi1oje

第24步、控制左右移動速度

1、增加時間函數(shù)

新建一個 文件，寫一個基礎獲取時間的函數(shù)，獲取毫秒級別的時間像這樣：

2、增加時間檢測函數(shù)

然后實現(xiàn)一個檢測上次按下時間的函數(shù)，這樣的話，會更加的流暢：

3、調(diào)用事件檢測函數(shù)

在按鍵按下的同時，調(diào)用這個函數(shù)：

分步視頻：/114uD07pC

第25步、控制下落速度

分步視頻：/11hkC9Fmm

第26步、方塊旋轉(zhuǎn)

1、旋轉(zhuǎn)多維列表

由于傳給 block 的是實際的下標，相當于在世界坐標系做操作，而旋轉(zhuǎn)最好是局部坐標系，所以 block 應該記錄局部坐標。我們把 BLOCK_SHAPE 進行改造

第一維代表形狀，第二維代表各種旋轉(zhuǎn)的情況，第三維代表局部坐標

方形旋轉(zhuǎn)90度還是它本身、長條旋轉(zhuǎn)90度變成這樣、z字型旋轉(zhuǎn)交換后變成這樣、而飛機旋轉(zhuǎn)四次是四種形狀，自己畫個圖就明白了。

2、改造 block 初始化

通過 形狀、旋轉(zhuǎn) 以及相對下標就可以確定每個方塊的絕對下標，左右移動，下落都應該是操作 相對下標。

3、修改方塊的坐標獲取

4、處理左移和右移

5、處理下落

6、修改生成配置的函數(shù)

7、實現(xiàn)旋轉(zhuǎn)函數(shù)

分步視頻：/11GXvlJYx

第27步、方塊消除

1、記錄閃爍狀態(tài)和次數(shù)

消除的時候，需要讓方塊進行閃爍，所以給每個 block 增加一個閃爍狀態(tài)，記錄閃爍的次數(shù)。

2、實現(xiàn)閃爍接口

實現(xiàn)一個開始閃爍的接口，并且在 update 的時候更新閃爍次數(shù)。

3、執(zhí)行更新函數(shù)

在 blockGroup 中遍歷所有的方塊，執(zhí)行 update 函數(shù)。

4、執(zhí)行渲染函數(shù)

并且在 block 的渲染函數(shù)中，判斷如果是閃爍狀態(tài)，并且閃爍次數(shù)為奇數(shù)，則不進行繪制，這樣就能看到 bilibili 的效果啦。

5、實現(xiàn)消除的邏輯

然后實現(xiàn)一個執(zhí)行消除的邏輯，傳參是第 row 行，將第 row 行的所有方塊，映射到哈希表中，如果發(fā)現(xiàn)某個方塊的下標在哈希表中，則執(zhí)行閃爍效果。

分步視頻：/11SbjBs4y

第28步、結(jié)束消除

分步視頻：/11W2NnE0x

第29步、失敗判定

分步視頻：/11X8za27U

第30步、計分規(guī)則

分步視頻：/11mPFbLEh

第31步、下個方塊

分步視頻：/11UW7VWpz

英雄算法聯(lián)盟免費體驗券，免費掃碼，可查看分步視頻：