[앱인벤터 기초] 그리기&애니매이션 - 이미지스프라이트 이해하기

앱인벤터에서 이미지스프라이트는 '캔버스'라는 공간 안에서 움직일 수 있는 컴포넌트입니다. 캔버스와 비슷하게 손가락으로 할 수 있는 액션(드래그, 플링, 터치)에 대해서 이벤트를 호출할 수 있습니다. 터치되는 위치는 X, Y 좌표 값으로 가져올 수 있습니다. X는 왼쪽에서부터 떨어진 픽셀 수입니다. Y는 위쪽에서부터 떨어진 픽셀 수입니다. 다른 이미지스프라이트 또는 공과 충돌하는지 이벤트를 호출할 수 있습니다. 

 

이미지스프라이트는 움직이는 애니매이션이 있는 컴포넌트로 게임 앱에서 가장 많이 활용합니다. 

 

---

이미지스프라이트 블록

 

블록	설명
	현재 이미지스프라이트와 다른 스프라이트가 충돌했을 때 실행되는 이벤트입니다. 회전된 상태의 충돌까지 감지하진 않습니다. 따라서 얇고 긴 이미지스프라이트의 경우 눈으로 보이는 것과 충돌이벤트가 발생하는것은 다를 수 있습니다.
	사용자가 이미지스프라이트를 드래그 할 때 발생하는 이벤트입니다. 드래그는 처음 시작하는 지점(시작X, 시작Y), 이전 지점(이전X, 이전Y), 현재 지점(현재X, 현재Y) 값을 가져올 수 있습니다.
	이미지스프라이트가 모서리(캔버스의 테두리)에 닿았을 때 실행되는 이벤트입니다. 모서리는 북쪽 (1), 북동쪽 (2), 동쪽 (3), 남동쪽 (4), 남쪽 (-1), 남서쪽 (-2), 서쪽 (-3), 북서쪽 (-4)의 8 개 방향 중 하나를 나타내는 정수로 표시됩니다.
	사용자가 이미지스프라이트를 플링(빠른 스와이프) 했을 때 발생하는 이벤트입니다. 왼쪽 상단을 기준으로 플링 시작의 좌표(x,y) 값을 제공합니다. 플링의 속도(ms)와 방향(0~360도), x속도와 y속도 값을 가져올 수 있습니다. 스프라이트가 플링 제스처 근처에 있으면 '플링된스프라이트' 값이 참이 됩니다.
	현재 이미지스프라이트와 다른 스프라이트가 충돌하지 않을 때 실행되는 이벤트입니다.
	사용자가 컴포넌트를 터치하고 있을 때 발생하는 이벤트입니다. 터치한 곳의 좌표 값을 가져올 수 있습니다.
	사용자가 컴포넌트를 터치하고 나서 손가락을 땔 때 발생하는 이벤트입니다. 터치한 곳의 좌표 값을 가져올 수 있습니다.
	사용자가 컴포넌트를 터치할 때 발생하는 이벤트입니다. 터치한 곳의 좌표 값을 가져올 수 있습니다.
	이미지스프라이트가 캔버스의 모서리(테투리)에 닿았을 때 튕기게 합니다. 모서리의 값을 요구합니다.
	현재 이미지스프라이트와 다른 스프라이트 사이에 충돌이 있는지 확인합니다. 참, 거짓 값이 반환됩니다.
	이미지스프라이트가 범위를 벗어나면 캔버스 범위 안으로 이동하게 합니다.
	이미지스프라이트가 (X,Y) 좌표로 이동하게 합니다.
	이미지스프라이트가 (X,Y) 좌표로 바라보게 합니다.
	이미지스프라이트가 다른 스프라이트를 바라보게 합니다.
	컴포넌트의 활성화여부 값을 가져오거나 변경할 수 있는 블록입니다. 참, 거짓 속성을 사용합니다. 참이면 컴포넌트를 클릭할 수있고 거짓이면 컴포넌트를 선택할 수 없습니다.
	이미지스프라이트의 방향 값을 가져오거나 변경할 수 있는 블록입니다. 0도는 화면의 오른쪽, 90도는 화면의 위쪽, 180도는 화면의 왼쪽, 270도는 화면의 아래쪽을 향합니다.
	세로길이 값을 가져오거나 변경할 수 있는 블록입니다. 숫자 속성(픽셀 단위)을 사용합니다.
	이미지스프라이트가 이동해야하는 시간을 가져오거나 변경할 수 있는 블록입니다. 기본값으로 100ms(밀리초)로 설정됩니다.
	컴포넌트의 사진 경로를 지정합니다. 텍스트 속성을 사용합니다.  * 한글 파일명은 지원하지 않습니다.
	컴포넌트에 넣은 이미지를 회전시킵니다. 숫자 값을 사용합니다. 디자이너 화면에서는 회전시켜도 보이지 않습니다. 스마트폰에 앱을 실행시켜야 확인할 수 있습니다.
	이미지스프라이트가 일정한 속도로 이동하게 합니다. 1초마다 10픽셀 씩 이동하려면 10을 입력하면 됩니다.
	보이기여부 값을 가져오거나 변경할 수 있는 블록입니다. 참, 거짓 속성을 사용합니다. 참이면 컴포넌트가 보이고 거짓이면 컴포넌트가 화면에서 보이지 않습니다.
	가로길이 값을 가져오거나 변경할 수 있는 블록입니다. 숫자 속성(픽셀 단위)을 사용합니다.
	컴포넌트의 X좌표 값을 가져오거나 변경할 수 있는 블록입니다.
	컴포넌트의 Y좌표 값을 가져오거나 변경할 수 있는 블록입니다.
	컴포넌트의 Z좌표 값을 가져오거나 변경할 수 있는 블록입니다.