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

2021年10月18日

前回

複数ある円のどれかをクリックしてその円の色を変えてみよう

前回はPygameで作った画面に円を描いて、その円をクリックすると円の色が変わるプログラムを作りました。
今回は円を複数作って、同じようにクリックした円の色を変えるプログラムを作りましょう。

複数の円を描画してクリックした円の色を変えるプログラム

円の中心をリストで定義して、クリックした位置がそれぞれの円の範囲内かどうかを確認します。

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

### 定数
WIDE   = 420    # 画面横サイズ
HIGHT  = 420    # 画面縦サイズ
R_SIZE = 60     # 円半径
W_TIME = 10     # 待ち時間
C_POS  = [[70, 70],[210, 70],[350, 70], ### 円の位置
          [70,210],[210,210],[350,210],
          [70,350],[210,350],[350,350]]

### 変数
circle = -1      # クリックされた円のインデックス

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

### 無限ループ
while True:

    ### 画面描写
    surface.fill((0,0,0))
    for idx,pos in enumerate(C_POS):
        if idx == circle:       # 円がクリックされていれば赤に変更
            rgb = (255,  0,  0)
        else:
            rgb = (255,255,255)
        pygame.draw.circle(surface, rgb, (pos[0],pos[1]), R_SIZE, 0)
    pygame.display.update()
    pygame.time.wait(W_TIME)

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

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

            ### インデックス初期化
            circle = -1

            ### 各円の範囲内でクリックしたか確認
            for idx,pos in enumerate(C_POS):

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

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

                ### カーソルが円内にあればリストのインデックスを保存
                if dist < R_SIZE:
                    circle = idx
                    break

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

### インポート

import sys

import math

import pygame

from pygame.locals import *

### 定数

WIDE = 420 # 画面横サイズ

HIGHT = 420 # 画面縦サイズ

R_SIZE = 60 # 円半径

W_TIME = 10 # 待ち時間

C_POS = [[70, 70],[210, 70],[350, 70], ### 円の位置

[70,210],[210,210],[350,210],

[70,350],[210,350],[350,350]]

### 変数

circle = -1 # クリックされた円のインデックス

### 画面初期化

pygame.init()

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

### 無限ループ

while True:

### 画面描写

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

for idx,pos in enumerate(C_POS):

if idx == circle: # 円がクリックされていれば赤に変更

rgb = (255, 0, 0)

else:

rgb = (255,255,255)

pygame.draw.circle(surface, rgb, (pos[0],pos[1]), R_SIZE, 0)

pygame.display.update()

pygame.time.wait(W_TIME)

### イベント取得

for event in pygame.event.get():

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

if event.type == MOUSEBUTTONDOWN:

### インデックス初期化

circle = -1

### 各円の範囲内でクリックしたか確認

for idx,pos in enumerate(C_POS):

### カーソル位置確認

x_size = pos[0]-event.pos[0]

y_size = pos[1]-event.pos[1]

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

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

### カーソルが円内にあればリストのインデックスを保存

if dist < R_SIZE:

circle = idx

break

### 終了処理

if event.type == QUIT:

pygame.quit()

sys.exit()

いずれかの円をクリックするとその円は赤になり、円の外をクリックすると赤い円は白になります。

次回

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

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

Pygame公式サイト