[Pygame] 06. 키보드와 마우스로 이미지 움직이기

이 글은 아래 영상을 참고했다.

https://www.youtube.com/watch?v=HK4Ge_xl4TA&list=PLz2iXe7EqJOMp5LozvYa0qca9E4OBkevW&index=6 

---

import pygame

이전에 배운 내용 활용해 이미지에 키보드/마우스 움직임 적용하기

키보드

• 키보드로 공 움직이기

pygame.init()

background = pygame.display.set_mode((550, 382)) # 배경 이미지에 맞추어 화면크기 설정함
pygame.display.set_caption('PYGAME_5')

fps = pygame.time.Clock() # 키보드용 fps 설정을 위해

# 이미지 파일 준비
image_bg = pygame.image.load('./image/fungo.png')
image_ball = pygame.image.load('./image/ball_small.png')
image_glove = pygame.image.load('./image/glove_small.png')

# 배경의 사이즈 가져오기
size_bg_width = background.get_size()[0]
size_bg_height = background.get_size()[1]

# ball의 사이즈 가져오기 (가로, 세로)
size_ball_width = image_ball.get_rect().size[0]
size_ball_height = image_ball.get_rect().size[1]

# ball의 좌표값 설정하기
x_pos_ball = size_bg_width/2 - size_ball_width/2 # 가운데
y_pos_ball = 0 # 맨 위

# 키보드 움직임에 의한 좌표 변수
to_x = 0
to_y = 0

play = True
while play:
    deltaTime = fps.tick(120)
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            play = False
        if event.type == pygame.KEYDOWN: # 키보드가 눌렸을때
            if event.key == pygame.K_UP:
                to_y = -2
            elif event.key == pygame.K_DOWN:
                to_y = 2
            elif event.key == pygame.K_RIGHT:
                to_x = 2
            elif event.key == pygame.K_LEFT:
                to_x = -2
        if event.type == pygame.KEYUP: # 키보드가 떼졌을때
            if event.key == pygame.K_UP:
                to_y = 0
            elif event.key == pygame.K_DOWN:
                to_y = 0
            elif event.key == pygame.K_RIGHT:
                to_x = 0
            elif event.key == pygame.K_LEFT:
                to_x = 0
                
    # ball의 좌표에 키보드 움직임 적용해주기
    x_pos_ball += to_x
    y_pos_ball += to_y
        
    # 이미지 삽입 및 업데이트
    background.blit(image_bg, (0,0))
    background.blit(image_ball, (x_pos_ball, y_pos_ball))
    pygame.display.update()
        
pygame.quit()

이전에 배운 내용들을 활용해 어렵지 않게 만들 수 있었다.

이미지 크기나 공의 움직임 속도를 위해 fps조절 정도만 했다.

 

시연 영상

 

어쩌다 보니 정근우 前 선수의 전설의 펑고짤을 발견하게되어 배경으로 사용했다.

내친김에 이를 활용해서 나중에는 '야신의 펑고게임'을 만들어볼까 싶다.

 

마우스

• 마우스로 글러브 움직이기

pygame.init()

background = pygame.display.set_mode((550, 382)) # 배경 이미지에 맞추어 화면크기 설정함
pygame.display.set_caption('PYGAME_5')

# 이미지 파일 준비
image_bg = pygame.image.load('./image/fungo.png')
image_ball = pygame.image.load('./image/ball_small.png')
image_glove = pygame.image.load('./image/glove_small.png')

# 배경의 사이즈 가져오기
size_bg_width = background.get_size()[0]
size_bg_height = background.get_size()[1]

# glove의 사이즈 가져오기
size_glove_width = image_glove.get_rect().size[0]
size_glove_height = image_glove.get_rect().size[1]

# glove의 좌표값 설정하기
x_pos_glove = size_bg_width/2 - size_glove_width/2
y_pos_glove = size_bg_height

play = True
while play:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            play = False
        if event.type == pygame.MOUSEMOTION:
            x_pos_mouse, y_pos_mouse = pygame.mouse.get_pos() # 마우스 좌표 불러오기
            x_pos_glove = x_pos_mouse - size_glove_width/2
            y_pos_glove = y_pos_mouse - size_glove_height/2
            
    # 이미지 삽입 및 업데이트
    background.blit(image_bg, (0,0))
    background.blit(image_glove, (x_pos_glove, y_pos_glove))
    pygame.display.update()
    
pygame.quit()

마우스로 이미지를 움직이는 것 또한 이전에 배운 내용들을 활용하면 어렵지 않게 구현할 수 있다.

그러나 이 코드에서 유의할 점이 하나 있다. 마우스 좌표를 글러브 좌표로 받을 때 계산식이 들어간다.

 

x_pos_glove = x_pos_mouse - size_glove_width/2

y_pos_glove = y_pos_mouse - size_glove_height/2

• 마우스 좌표를 그대로 받지 않고 계산해서 쓰는 이유
  • pygame은 기본좌표가 (0,0), 즉 왼쪽 가장자리가 기본 좌표로 설정된다.
  • 마우스의 좌표를 그대로 적용한다면 글러브 가운데가 아닌 왼쪽 가장자리를 중심으로 마우스를 따라다니게 된다.

 

좌표를 계산하지 않고 사용할 경우

 

좌표를 계산한 경우

위와 같은 이유로, 마우스의 좌표를 받아 글러브의 중앙으로 좌표를 옮겨주는 계산이 필요하다.