파이썬 - [이미지 애니메이션]

▣ 이번장에서는 파이썬 이미지를 여러 개 그려 움직이는 애니메이션을 만들어보겠습니다. 

pygame.event.key 에 관련하여 캐릭터가 움직이는 부분은 따로 공부해주세요.

 

 

▣ 캐릭터에 움직이는 애니메이션 이미지는 여기 홈페이지를 통해 무료를 다운로드하여주세요.

https://itch.io/game-assets/free

▣ 또한 이미지 크기 및 방향을 변경해주셔야 합니다.

오른쪽, 왼쪽을 움직이는 이는 애니메이션을 제작하기 때문에 꼭 오른쪽 방향, 왼쪽 방향 이미지를 다운로드하거나 

편집해서 수정해주세요.

 

https://www.iloveimg.com/ko/crop-image

이미지를 신속하게, 무료로 잘라내세요!

▣ 이미지를 자르기 위해 무료로 여기 홈페이지를 활용해주세요.

 

https://www.remove.bg/ko

이미지에서 배경 제거 – remove.bg

▣ 이미지 배경을 제거하는 건 여기 홈페이지를 활용해주세요.

제가 위에서 말씀드린 홈페이지에 다운로드하으셔도 되지만 우리가 어디에 출시하지 않으면

구글에서 다운로드하으셔서 진행하셔도 됩니다. 

 

▣ 먼저 player_posX 포지션에 변수와 키를 눌렀을 때 상태에 대한 변수 그리고 

walkCount에 변수를 정의해주세요.

player_posX는 우리가 움직일 이미지에 포지션을 의미합니다.

is_right, is_left 변수는 키를 누르고에 상태도 있지만 우리가 왼쪽 오른쪽 방향에 따른

이미지를 그리기 위한 상태 변수가 이기도 합니다.

walkCount는 우리가 키를 눌렀을 때 

애니메이션 이미지가 순서대로 하나씩 리스트 요소 값으로 접근하기 위함입니다.

 

▣ pygame.init()으로 꼭 pygame에 초기화를 진행해주세요.

 

▣ 여러 가지 방법이 있겠지만, 

저는 리스트 형식으로 right_walk, left_walk 이미지를 저장하겠습니다. 

pygame.image.load() 매개변수 값에 저렇게 이미지에 이름만 넣을 수도 있고, 경로를 넣을 수도 있습니다.

이미지 이름만 넣을 수 있는 이유는 우리가 만든. py 소스 파일와 같은 경로에 이미지가 있기 때문입니다. 

idle은 아무것도 누르지 않고 가만히 있는 이미지를 그리는 이미지입니다.

그리고 꼭 left_walk, right_walk 이미지에 방향을 확인해주시면서 리스트에 저장해주세요.

방향이 안 맞으면 나중에 애니메이션이 이상하게 보일 수 있습니다.

 

▣ 자 이제 def playerMove()라는 함수를 선언하고 여기에 애니메이션을 그려주는 코드를 넣어보겠습니다.

우선 전역 변수에 있는 walkCount, player_posX, player_posY 값을 사용해야 하기 때문에 선언해주세요.

그리고 screen.fill((0,0,0)) 배경을 채워주는 코드가 있습니다. 

이건 우리가 밑에 코드처럼 그냥 screen.blit() 함수로 이미지를 하나하나 다 그려주게 되면

 

▣ 그렇게 그려진 이미지가 다 보이게 때문에 screen.fill((0,0,0)) 을 통해 이미지를 그려주고 지우고 그려주고 지우 고를 반복하게 합니다. 

 

▣ 그리고 if walkCount > 4: walkCount = 0 코드는 리스트에 범위를 넘지 않기 위해 

walkCount = 0를 초기화해주기 위함입니다. 

이게 없으면 나중에 키를 눌렀을 때 walkCount에 값이 4,5,6,7,8,9.... 이런 식으로 계속 숫자가 늘어나는걸 

방지하기 위함입니다. 

 

▣ if is_left == True: screen.blit(left_walk [walkCount], (playerPos_x, playerPos_y)) 이런 식으로 코드를 진행했습니다. 

간단하게 하나씩 보게 되면 우리가 가려고 하는 방향으로 키를 눌렀을 경우 screen.blit() 함수로 이미지를 그립니다.

(left_walk [walkCount])는 우리가 아까 만든 이미지에 리스트에 [walkCount] 요소 값으로 접근하게 됩니다.

walkCount값이 0일 경우 left_walk [0] 이런 식으로 0에 이미지를 그려줍니다. 

그리고 밑에 walkCount +=1 값이 넣어줍니다. 

그럼 left_walk [1]으로 다음 이미지를 그리게 됩니다. 

그리고 if walkCount > 4: walkCount = 0로 범위가 넘게 되면 초기화되는 코드가 진행하게 됩니다. 

 

▣ clock = pygame.time.Clock()을 선언해주세요.

그리고 while True: 값으로 메인을 무한으로 진행하고

clock.tick(30)으로 프레임을 30으로 제한했습니다. 

 

▣ for event in pygame.event.get() 함수로 키에 입력 값을 event변수에 넣어주세요.

if event.type == pygame.KEYDOWN: , if event.type == pygame.KEYUP:으로 각각 키를 눌렀을 경우

키를 누르고 뗏을 경우에 조건문을 만들어주세요.

그 안에 event.key == pygame.K_LEFT: 키에 값이 머라면

is_left = True , is_right = False 이런 식으로 코드를 넣어주세요.

 

▣ 그런 다음에 if is_right == True: 상태에 따라 player_posX +=10포 지션을 바꿔주세요.

playerMove() 함수는 포지션을 움직인 후에 호출해주세요.

코드를 완성하고 실행해보면

 

▣ 오른쪽 왼쪽 움직이면서 애니메이션이 되는 걸 확인할 수 있습니다. 

 

▣ 이제 여러분들이 원하는 캐릭터를 한 개 더 추가해서 애니메이션을 완성해보세요.