Pythonスクリプト【Pygameで円をクリックして円の色を変えよう】

2021年10月15日

円をクリックして円の色を変えてみよう

今回はPygameで作った画面に円を描いて、その円をクリックすると円の色が変わるプログラムを作ります。
画面中央にpygame.draw.circle()で円を描いて、円の範囲内でクリックすると円の色が赤になるようにします。(円の範囲外だった場合は白に戻します)
クリックした位置が円の範囲内にあるかどうかは、三平方の定理(a² + b² = c²)を使います。
三平方の定理を使って、クリックした位置が円の中心から円の半径内に収まっているかどうかで判定します。
以下の図の場合は、80² + 50² = √8900 となり、斜辺の長さ(赤線の長さ)は94.33...になります。

円をクリックすると色を変えるプログラム

クリックした位置が円の中心からどれくらいの距離かは、以下の流れで求めています。

処理の流れ

マウスボタンをクリックした座標を取得
円の中心座標とクリックした座標との相対位置を取得
三平方の定理を使って円の中心座標からクリックした座標の距離を取得

### インポート
import sys
import math
import pygame
from pygame.locals import *

### 定数
WIDE   = 400  # 画面横サイズ
HIGHT  = 400  # 画面縦サイズ
R_SIZE = 150  # 円半径
W_TIME = 10   # 待ち時間

### 画面初期化
pygame.init()
surface = pygame.display.set_mode((WIDE, HIGHT))

### 変数初期化
x = WIDE/2          # 横座標
y = HIGHT/2         # 縦座標
rgb = (255,255,255) # 円の色

### 無限ループ
while True:

    ### 画面描写
    surface.fill((0,0,0))
    pygame.draw.circle(surface, rgb, (x,y), R_SIZE, 0)
    pygame.display.update()
    pygame.time.wait(W_TIME)

    ### イベント取得
    for event in pygame.event.get():

        ### マウスボタンイベント
        if event.type == MOUSEBUTTONDOWN:

            ### カーソル位置確認
            x_size = x-event.pos[0]
            y_size = y-event.pos[1]

            ### 円の中心からの距離
            dist = math.sqrt(x_size**2+y_size**2)

            ### カーソルが円内
            if dist < R_SIZE:
                rgb = (255,  0,  0)

            ### カーソルが円外
            else:
                rgb = (255,255,255)

        ### 終了処理
        if event.type == QUIT:
            pygame.quit()
            sys.exit()

### インポート

import sys

import math

import pygame

from pygame.locals import *

### 定数

WIDE = 400 # 画面横サイズ

HIGHT = 400 # 画面縦サイズ

R_SIZE = 150 # 円半径

W_TIME = 10 # 待ち時間

### 画面初期化

pygame.init()

surface = pygame.display.set_mode((WIDE, HIGHT))

### 変数初期化

x = WIDE/2 # 横座標

y = HIGHT/2 # 縦座標

rgb = (255,255,255) # 円の色

### 無限ループ

while True:

### 画面描写

surface.fill((0,0,0))

pygame.draw.circle(surface, rgb, (x,y), R_SIZE, 0)

pygame.display.update()

pygame.time.wait(W_TIME)

### イベント取得

for event in pygame.event.get():

### マウスボタンイベント

if event.type == MOUSEBUTTONDOWN:

### カーソル位置確認

x_size = x-event.pos[0]

y_size = y-event.pos[1]

### 円の中心からの距離

dist = math.sqrt(x_size**2+y_size**2)

### カーソルが円内

if dist < R_SIZE:

rgb = (255, 0, 0)

### カーソルが円外

else:

rgb = (255,255,255)

### 終了処理

if event.type == QUIT:

pygame.quit()

sys.exit()

円をクリックすると円は赤になり、円の外をクリックすると円は白になります。

次回

Pythonスクリプト【Pygameで複数ある円をクリックしてその円の色を変えよう】

Pygameの詳しい使い方は、以下のPygame公式サイトを参照してください。

Pygame公式サイト