【Python】那些年我們一起玩過的遊戲(三)-打磚塊

A、提案企劃

一句話形容這個遊戲

• 每個人心中都有一款打磚塊

遊戲類型

• 休閒類

遊戲特色

• 簡單易懂的玩法

發想概念

• 藉以重製打磚塊遊戲學習Python語言

遊戲玩法

• 玩家控制板子左右移動接住往下掉落中的球使其不要掉落到地面，並讓移動中的球擊毀畫面中的磚塊
• 清除掉畫面上所有磚塊就算過關

目標族群

• 想用Python學做遊戲的人

發行平台

• Windows
• MAC
• Linux

預計製作期

• 7天

美術風格

• 區塊顏色風格

遊戲周邊

• 手機吊飾
• 扭蛋掌機

製作人員需求

• 企劃 x 1
• 美術 x 1
• 程式 x 1

收費方式

• 自由捐贈

製作預算

• 繼續燒熱血當預算

參考資料

• 【維基百科】 打磚塊

B、執行企劃

前言

使用解析度

• 800 x 600

遊戲玩法

遊戲流程

遊戲畫面示意圖

細節說明

• 磚塊區的磚塊總量為11x9共99塊。
• 球會持續以45度角方向持續前進，碰到磚塊、牆壁、板子後會以45度反彈。
• 板子只能左右移動，無法上下移動。
• 玩家的任務就是控制板子接住掉落中的球，讓球反彈去擊毀畫面上的所有磚塊。
• 畫面上的全部磚塊被擊毀後，遊戲重新開始。
• 板子如果沒接到球(使其掉落板子下)，球會自動重新產生在板子上。

遊戲操作

鍵盤

滑鼠

美術元件列表

磚塊

球

板子

Ｃ、開發日誌

開發工具

使用語言與版本

安裝套件

• PyGame - 遊戲開發套件

第2~3天

系統分析與設計

右上移動

• 可用公式 (x=x+1)， (y=y-1)達成

右下移動

• 可用公式 (x=x+1)， (y=y+1)達成

左下移動

• 可用公式 (x=x-1)， (y=y+1)達成

如何讓球反彈

if(發生左右牆碰撞): 
　　
　　dx = -dx
if(發生上下牆碰撞): 
　　
　　dy = -dy

ball_x += dx 
ball_y += dy

第4~7天

程式碼說明

繪製圖形程式碼

• 畫矩形

pygame.draw.rect(畫布, 顏色, [x坐標, y坐標, 寬度, 高度], 線寬)

• 畫圓

pygame.draw.circle(畫布, 顏色, (x坐標, y坐標), 半徑, 線寬)

【drew.py程式碼】

• 3 ~29：畫矩形物件程式碼。

paddle = Box( pygame物件, 畫布, 物件名稱, 
[x坐標, y坐標, 寬度, 高度], 顏色)

paddle = Box(pygame, canvas, “paddle”, [0, 0, 100, 24],(255,255,255))

• 24 ~29：判斷self.visible是否為True來更新這個矩形，反之就略過不畫。
• 31 ~59：畫圓形物件程式碼。

ball = Circle( pygame物件, 畫布, 物件名稱, (x坐標, y坐標), 半徑, 顏色)

ball = Circle(pygame, canvas, “ball”, [ball_x, ball_x], 8,
 (255,255,255))

• 54 ~59：判斷self.visible是否為True來更新這個圓形，反之就略過不畫。

主程式

【play.py程式碼】

• 31 ~ 37：秀圖函數

# 函數:秀字. 
def showFont( text, x, y, color): 
  
　　global canvas 
  
　　text = font.render(text, True, color) 
  
　　canvas.blit( text, (x,y))

showFont( 文字, x, y, 顏色)

showFont( u”磚塊數量” 0, 0, (255, 0, 0))

• 39 ~48：碰撞判斷

# 函數:碰撞判斷. 
# x : x 
# y : y 
# boxRect : 矩形 
def isCollision( x, y, boxRect): 
  
　　if (x >= boxRect[0] and x <= boxRect[0] + boxRect[2] and y >=
　　  boxRect[1] and y <= boxRect[1] + boxRect[3]): 
　　　　    return True; 
  
　　return False;

isCollision( x, y, 矩形)

if(isCollision( ball.pos[0], ball.pos[1], paddle.rect)):
。。。

• 50 ~72：重新開始遊戲

# 函數:初始遊戲、重新開始遊戲. 
def resetGame(): 
    
　　# 宣告使用全域變數. 
    
　　global game_mode, brick_num, bricks_list, dx, dy 
    
　　# 磚塊 
    
　　for bricks in bricks_list: 
　　　　# 亂數磚塊顏色 
        
　　　　r = random.randint(100,200) 
　　　　g = random.randint(100,200) 
　　　　b = random.randint(100,200) 
        
　　　　bricks.color = [r,g,b] 
    # 開啟磚塊. 
    
bricks.visivle = True 
    # 0:等待開球 
    game_mode = 0 
    # 磚塊數量. 
    
brick_num = 99 
    # 移動速度. 
    dx = 8 
    dy = -8

• 86 ~89：建立板子

# 設定板子初始位置. 
paddle_x = 0 
paddle_y = (canvas_height — 48) 
# 建立板子
paddle = Box(pygame, canvas, “paddle”, [paddle_x, paddle_y, 100, 24], 
(255,255,255))

• 91 ~94：建立球

# 設定球初始位置.
ball_x = paddle_x 
ball_y = paddle_y 
# 建立球
ball = Circle(pygame, canvas, “ball”, [ball_x, ball_x], 8,
 (255,255,255))

• 96 ~107：建立磚塊

# 初始產生磚塊變數
brick_num = 0 
brick_x = 70 
brick_y = 60 
brick_w = 0 
brick_h = 0 
# 使用迴圈產生99個磚塊
for i in range( 0, 99): 
　　   # 每列11個磚塊
　　
　　if((i % 11)==0): 
　　　　
　　　　brick_w = 0 
       
　　　　# 每行區隔18像素
　　　　
　　　　brick_h = brick_h + 18 
　　
   # 建立磚塊並將其加入bricks_list陣列內
　　
　　bricks_list.append (Box(pygame, canvas, “brick_”+str(i), [

　　　　brick_w + brick_x, brick_h+ brick_y, 58, 16], 
　　
　　[255,255,255])) 
   # 每個磚塊區隔60像素
　　
　　brick_w = brick_w + 60

• 111~200：主程式迴圈
• 116~134：判斷鍵盤與滑鼠輸入

# 判斷輸入. 
for event in pygame.event.get(): 
    
　　# 離開遊戲. 
    
　　if event.type == pygame.QUIT: 
　　　　running = False 
　　# 判斷按下按鈕 
　　if event.type == pygame.KEYDOWN: 
　　　　# 判斷按下ESC按鈕 
　　　　if event.key == pygame.K_ESCAPE: 
　　　　　　running = False 
        
　　　　# 判斷Mouse. 
　　　　if event.type == pygame.MOUSEMOTION: 
            
　　　　　　paddle_x = pygame.mouse.get_pos()[0] — 50 
        
　　　　if event.type == pygame.MOUSEBUTTONDOWN: 
            
　　　　　　if(game_mode == 0): 
                
　　　　　　　　game_mode = 1

for event in pygame.event.get():

if event.type == pygame.KEYDOWN:

if event.key == pygame.K_ESCAPE:

if event.type == pygame.MOUSEMOTION:
    　　paddle_x = pygame.mouse.get_pos()[0] - 50

if event.type == pygame.MOUSEBUTTONDOWN: 
    
if(game_mode == 0): 
        
　　game_mode = 1

• 140~157：判斷球是否碰撞到磚塊

# 利用迴圈取的畫面上的所有磚塊 
for bricks in bricks_list: 
　　　　
　　# 判斷球是否到碰磚塊. 
　　　　
　　if(isCollision( ball.pos[0], ball.pos[1], bricks.rect)): 　　　　　　　　
# 判斷磚塊是否為顯示中.
　if(bricks.visivle):

# 1.扣除磚數量. 
brick_num = brick_num -1 
# 2.如果畫面上的磚塊數量已經為0就執行resetGame()函數（重新開始遊戲）. 
if(brick_num <= 0): 
　　
　　resetGame() 
　　
　　break 
# 3.處理球反彈. 
dy = -dy; 
# 4.關閉碰撞到的磚塊. 
bricks.visivle = False

• 166~169：球碰到板子處理讓球反彈

# 碰撞判斷-球碰板子. 
if(isCollision( ball.pos[0], ball.pos[1], paddle.rect)): 
    # 球反彈. 
    dy = -dy;

• 171~190：依照game_mode狀態進行邏輯處理

# 依照板子中心位置為參考來設定球位置 
# 設定球x座標
ball.pos[0] = ball_x = paddle.rect[0] + ( (paddle.rect[2] — 
ball.radius) >> 1 ) 
# 設定球y座標
ball.pos[1] = ball_y = paddle.rect[1] — ball.radius

ball_x += dx 
ball_y += dy

if(ball_y + dy > canvas_height — ball.radius):

# 右牆或左牆碰撞. 
if(ball_x + dx > canvas_width — ball.radius or ball_x + dx < 
ball.radius): 
    
　　dx = -dx 
# 下牆或上牆碰撞 
if(ball_y + dy > canvas_height — ball.radius or ball_y + dy < 
ball.radius): 
    
　　dy = -dy

執行遊戲

• 請在命令列下輸入python play.py 以執行遊戲

GitHub下載原始碼

後記

版本更新

2020/4/19

• 以下為執行遊戲畫面

• 執行方式如下

請在命令列下輸入python play_gray_scale.py以執行遊戲

• 程式碼修改說明

# 建立畫佈大小.
canvas = pygame.display.set_mode((canvas_width, canvas_height))

# 建立畫佈大小.
canvas = pygame.display.set_mode((canvas_width, canvas_height), 
pygame.DOUBLEBUF and pygame.FULLSCREEN )