---
type: slide
---
# pygame
---
## 今日範例
[下載](https://github.com/Fudge0625/CRC-pygame/archive/refs/heads/main.zip)
---
## 安裝環境
```bash
pip install pygame pygbag
```
---
## 執行
```bash
python main.py
# 或是 wasm
pygbag .
```
---
讓我們一步一步地解釋它：
`import pygame`：這將導入pygame模組，用於建立視窗和處理圖形輸出。
`import asyncio`：這將導入asyncio模組，用於處理非同步事件。
---
`async def main():`：
這定義了一個名為main的異步函數。
`BLACK, WHITE = (0, 0, 0), (255, 255, 255)`：
定義了黑色和白色的顏色。
`FPS = 240`：設置了每秒幀數。
---
`RES = W, H = 280, 280`：設置了視窗的寬度和高度。
`paint_board = (28, 28)`：定義了畫板的大小。
`pixel_w, pixel_h = W / paint_board[0], H / paint_board[1]`：計算了每個像素的寬度和高度。
---
`pygame.init()`：初始化pygame庫。
`clock = pygame.time.Clock()`：建立了一個時鐘對象，用於控制遊戲循環的速度。
`screen = pygame.display.set_mode((RES))`：建立了一個指定大小的視窗。
`screen.fill(WHITE)`：將視窗填充為白色。
---
`img = [[0] * paint_board[1] for _ in range(paint_board[0])]`：建立了一個二維列表img，用於存儲畫板上每個像素的顏色值。
`running = True`：設置了一個變數來表示遊戲是否正在運行。
`while running:`：進入了主循環。
`clock.tick(FPS)`：限制遊戲的幀數。
---
`pygame.display.set_caption("FPS: {:.2f}".format(clock.get_fps()))`：設置了視窗的標題，顯示當前幀數。
---
`mouse_pos = pygame.mouse.get_pos()`：獲取滑鼠的位置。
`mouse_pressed` = pygame.mouse.get_pressed()：獲取滑鼠按鍵的狀態。
`if mouse_pressed[0]:`：如果滑鼠左鍵被按下：
---
`x, y = int(mouse_pos[0] // pixel_w), int(mouse_pos[1] // pixel_h)`：計算當前滑鼠位置對應到畫板上的像素位置。
`img[x][y] = 255`：將對應的像素設置為黑色。
---
`paint = pygame.Rect((x * pixel_w, y * pixel_h), (pixel_w, pixel_h))`：建立一個矩形，表示要繪製的像素。
`pygame.draw.rect(screen, BLACK, paint)`：在視窗上繪製矩形，顏色為黑色。
---
`for event in pygame.event.get():`：遍歷所有pygame事件。
如果有鍵盤按下事件：
如果按下的是"d"鍵：清空畫板。
如果按下的是"s"鍵：將畫板保存為圖片。
如果有退出事件：將`running`設置為`False`，退出主循環。
---
`pygame.display.update()`：更新視窗。
`await asyncio.sleep(0)`：暫停異步運行以等待下一次迭代。
`pygame.quit()`：關閉pygame庫。
`if __name__ == "__main__":`：確保這段程式碼只有在直接運行時才執行。
`asyncio.run(main())`：運行main()函數作為異步任務。
Sign in with Wallet
Connect another wallet