[Cocos2d-x]04.스프라이트 사용하기

안녕하세요 유랑입니다.





이번 시간에는 스프라이트 사용법에 대해 배워보겠습니다.

시작하겠습니다.




1. Sprite Class




스프라이트 클래스는 실제로 화면에 출력되어 보이는 구체적인 개념의 클래스입니다.

스프라이트는 화면을 구성하는 정적인 이미지나 애니메이션이 되는 일련의 이미지들을 가르키는 말로 

대개 게임에서 사용되는 이미지들을 말합니다.

대략적인 정의는 다음과 같습니다.

*이미지 파일을 화면에 출력하는 역할을

*이미지 파일의 로딩과 화면 출력과 관련된 다양한 함수를 제공


2. 스프라이트 사용하기


2-1) 프로젝트 생성


다음과 같은 위치에 프로젝트를 생성합니다.

이름과 위치는 바꾸셔도 상관 없습니다.







2-2) 이미지 추가



스프라이트 필요한 이미지 파일을 찾아보자.

Cocos에서 제공하는 캐릭터 그로시니와 그로시니 시스터1을 다음 위치에서 복사하자.









2-3) 코드



코드는 다음과 같다 그로시니와 그로시니 시스터를 생성 후 위치를 지정하고 

레이어에 설정한 객체를 추가하는 방식이다.

이때 z-order라는 z축의 개념을 사용하여 두 이미지가 겹쳐져 있을때 위아래를 지정 가능하다.







2-4) 실행결과



실행결과는 다음과 같다.

그로시니가 그로시니 시스터 위에 나와 있는걸 볼 수 있다.







3. 부모 & 자식



이번에는 스프라이트를 부모자식관계로 만드는 법에 대해 알아보자.

이걸 사용하면 검을 가진 캐릭터가 움직일 때 검도 함께 움직여지는 방식이다.

이때 캐릭터가 부모이고 검이 자식이다.




3-1) 프로젝트 생성



다음과 같은 위치에 프로젝트를 생성합니다.

이름과 위치는 바꾸셔도 상관 없습니다.







3-2) 이미지 추가



스프라이트 필요한 이미지 파일을 찾아보자.

Cocos에서 제공하는 캐릭터 그로시니와 흰색 512x512 이미지를 복사하자.









3-3) 코드



부모와 자식 스프라이트를 만들자.

부모는 그로시니고, 자식은 hp바이다.

자식은 부모에게 속하게 되면 위치가 부모기준이 되므로 유의하자.









3-4) 실행결과



실행결과는 다음과 같다.

그로시니 위에 hp바가 생긴걸 볼 수 있다.

그로시니가 움직일 경우 hp바가 똑같이 움직인다.

이게 바로 부모와 자식관계이다.








4. 마무리




오늘 강의는 여기까지입니다.

스프라이트를 사용하여 캐릭터 이미지를 표현해 보았습니다.

다음시간에는 메뉴를 만드는법에 대해 배워보겠습니다.

감사합니다.






댓글

Designed by JB FACTORY