파이게임(pygame) 튜토리얼 - 버튼 만들기
또 다른 입력장치, 마우스
키보드로 텍스트도 움직여보고, HP바도 조절해보았지만 보통의 컴퓨터의 입력장치에는 키보드를 제외하고도 ‘마우스’라는 친구가 있다. 이 마우스라는 친구를 사용해서 HP바를 조절하는 버튼을 만들어보자.
코드 추가하기
우리들은 이전의 포스팅에서 drawHP와 main함수를 만들었었다. 우리들은 새로운 버튼을 그려줘야하니 새로운 버튼을 그리는 함수 drawbuttons를 구현해보자.
- 우리들은 새로운 버튼을 도형으로 그릴 것이고
- 그 도형의 위치에 해당하는 곳에 마우스를 클릭했을 때
- HP바가 증/감하는 코드를 만들것이다.
새로운 버튼 그리기
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#일단 도형을 그리자
def drawbuttons():
r = 45 #버튼의 반지름
r_margin = 10 #버튼끼리의 간격
colors = [red, black] #버튼의 색깔을 달리하기 위한 리스트(for문에 활용예정)
num = 2 #버튼의 개수
margin = int((ScreenWidth - ((num*r)+((num-1)*r_margin))) / 2)#int로 해주는 이유는 화면을 표시하는 좌표가 정수형이라서.
for i in range(0, num):
LEFT = margin + (i*r) + (i*r_margin)
UP = ScreenHeight - 10
pygame.draw.rect(Screen, colors[i], (LEFT, UP, r, r))
pygame.draw.rect(Screen, white, (LEFT+2, UP+2, r-4, r-4))
margin = int((ScreenWidth - ((num*r)+((num-1)*r_margin))) / 2)
ScreenWidth(화면의 가로길이)에서 ((num * r)+((num - 1) * r_margin))을 빼주고 2로 나누어준다.
여기서 (num * r)+((num - 1) * r_margin) 은 버튼의 길이와 버튼의 여백의 총합이고 2로 나누어주는 이유는 버튼을 중앙에 표시해주기 위해서다.
도형의 위치에 해당하는 곳에 마우스 클릭 이벤트 만들기
1
2
3
4
5
6
7
8
9
10
11
12
13
def main():
drawbuttons()
for event in pygame.event.get():
~
if event.type == MOUSEBUTTONUP:
x, y = event.pos
if pygame.Rect(270, 425, 45, 45).collidepoint(x, y):
if nowHP != maxHP:
nowHP += 1
elif pygame.Rect(325, 425, 45, 45).collidepoint(x, y):
if nowHP != 0:
nowHP -= 1
MOUSEBUTTONUP 이라는 이벤트는 ‘마우스를 클릭했을 때’의 이벤트다. 반대로 ‘마우스를 뗐을 때’의 이벤트는 MOUSEBUTTONDOWN 이다.
클릭한 위치의 좌표를 x, y에 담아주고,
위에 그려진 도형의 좌표안에 x, y값이 들어 있을 때 이벤트를 발생하는 식의 진행이다.
완성된 코드
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
##############################
import pygame, sys
from pygame.locals import *
pygame.init()
##############################
#COLOR
white = (255, 255, 255)
black = (0, 0, 0)
red = (255, 0, 0)
green = (0, 255, 0)
blue = (0, 0, 255)
##############################
pygame.display.set_caption("HP BAR")
ScreenWidth = 640
ScreenHeight = 480
Screen = pygame.display.set_mode((ScreenWidth, ScreenHeight))
maxHP = 10
txtHPbar_FONT = pygame.font.Font(None, 32)
txtHPbar = txtHPbar_FONT.render("{} / {}".format(maxHP, maxHP), True, red, white)
txtHPbar_Area = txtHPbar.get_rect()
txtHPbar_Area.center = (ScreenWidth/2, ScreenHeight/2)
def main():
nowHP = 5
while True:
for event in pygame.event.get():
if event.type == QUIT or nowHP == 0:
pygame.quit()
sys.exit()
elif event.type == KEYDOWN:
if event.key == K_UP:
if nowHP != maxHP:
nowHP+=1
elif event.key == K_DOWN:
if nowHP > 0:
nowHP-=1
elif event.type == MOUSEBUTTONUP:
x, y = event.pos
if pygame.Rect(270, 425, 45, 45).collidepoint(x, y):
if nowHP != maxHP:
nowHP += 1
elif pygame.Rect(325, 425, 45, 45).collidepoint(x, y):
if nowHP != 0:
nowHP -= 1
txtHPbar = txtHPbar_FONT.render("{} / {}".format(nowHP, maxHP), True, red, white)
Screen.fill(white)
Screen.blit(txtHPbar, txtHPbar_Area)
drawHP(nowHP)
drawButtons()
pygame.display.update()
def drawHP(HP):
r = int((ScreenHeight - 40) / maxHP) # Screenheight-40의 값을 maxHP로 나누어준다. 위 아래 20씩 여분공간을 두고 maxHP의 개수를 표현하기 위해 나누어줌
pygame.draw.rect(Screen, black, (20, 20, 20, 20 + ((maxHP - 0.5) * r)))
#3번째 인자는 (X, Y, 가로, 세로)이다. 20, 20의 위치부터 검정으로 20, 20+((maxHP-0.5)*r)을 한다는 뜻
for i in range(maxHP):
if HP >= (maxHP - i):
pygame.draw.rect(Screen, red, (20, 20 + (i*r), 20, r))
pygame.draw.rect(Screen, white, (20, 20 + (i * r), 20, r), 1)
return
def drawButtons():
r = 45 #버튼의 반지름
r_margin = 10 #버튼들간의 간격
colors=[red, black] #for문을 활용하기위한 colors 리스트
num = 2 #버튼의 개수
#r*num = 버튼의 개수, r_margin*(num-1) 은 여백의 총합
margin = int((ScreenWidth - ((r*num) + (r_margin*(num-1)))) / 2)
for i in range(0, num):
left = margin + (i * r) + (i * r_margin)
up = ScreenHeight - r - 10
pygame.draw.rect(Screen, colors[i], (left, up, r, r))
pygame.draw.rect(Screen, white, (left+2, up+2, r-4, r-4), 2)
if __name__ == '__main__':
main()
정리
기능에 따라 함수를 나누어주고, 각 이벤트에 따라 코드를 정리해주면 간단한 게임을 만드는데는 어려움이 없는 것 같다.
댓글남기기