[유니티 강좌 4] 2D게임 배경 만들기
지난 포스팅에 이어서 이번에는 배경을 스크롤 해서 움직이는 화면을 만들어 보도록 하겠습니다. 현재 이 게임의 배경으로 사용하고 있는 Cube에 하늘 이지미 텍스처를 매핑하고, 이 큐브를 천천히 오른쪾에서 왼쪽으로 이동하게 하면 되는데요. 이때 배경의 일부분이 화면을 벗어나지 않도록 배경을 두장 나란히 붙여놓고 동시에 움직이게 합니다. 앞에 있는 배경이 화면을 벗어나면 바로 오른쪾으로 이동하게 되고 깜빡거림 없이 다음 화면이 이어서 이동하게 됩니다.
유니티에서는 프로그램에서 이미지등의 리소스를 동적으로 불러오기 위해서는 리소를
Resources라는 폴더에 저장해야 합니다. 이것은 정해진 규칙이기 때문에 프로젝트 탭
에서 Resources폴더를 만들어어 이미지를 넣어두겠습니다. 
유니티에서는 그래픽 이미지를 3D 오브젝트에 매핑하기 위해서는 텍스처로 사용하는데 그
크기는 32x32, 64x64, ...1024x1024....와 같이 2제곱으로 규격을 저장해야 최적화가 잘됩니다.
여기서 배경은 z축을 기준으로 큐브의 뒷면에 배치될 것이므로 이미지의 상하가 뒤집혀서
매핑될 것입니다. 때문에 준비한 이미지를 상하를 뒤집어서 Resources 폴더에 저장하도록
하겠습니다. 이미지 형식은 jpg, png, psd등 어느것을 사용해도 상관없습니다만 파일명은
sky1, sky2....과 같이 일련번호를 붙여서 저장해야 합니다.
두장의 이미지를 연결해야 하기 때문에 비슷한 이미지를 두장 붙이는게 연결될때 튀지 않습니다.
배경에 사용할 머티리얼을 만들어서 하늘 이미지를 선택해서 배경에 반영시키겠습니다.
그리고머티리얼 sky1에 설정한 색깔은 흰색으로 바꿉니다.
이렇게 머티리얼을 설정하면 다음과 같이 어느정도 하늘 이미지가 셋팅이 되네요.
이제 배경화면이 스크롤 되도록 자바스크립트를 작성해서 연결하도록 하겠습니다.
다음과 같이 작성하여 원경(Cube)에 연결해서 게임을 실행해 보겠습니다.
게임을 실행해보니까 스피드가 너무 낮아서 많이 느리네요..ㅎㅎ 그런데 지금 이미지는 원경이라서 천천이 지나나게 하는게 맞습니다. 아래 동영상은 시간관계상 speed=10;으로 설정해서 녹화한 것입니다. 어떻게 움직이는지 참고만 하기 위해서 설정한겁니다.
배경이 제대로 이동하는게 확인이 됐으니 이제 하이어라키 탭에서 Ctrl+D키를 눌러 복사를 해서 이름은 "원경2"로 바꾸고 두개의 배경을 나란히 배치를 해서 끓김이 없도록 하겠습니다.
두장을 연결했는데...연결 부위에 구름 모양이 조금 안맞네요^^; 포토샾으로 살짝 만시면 되겠죠. 전 그냥 패스하고 이대로 진행 할게요^^ 이제 게임을 실행해 보면 끓김없이 두장의 배경이 번갈아 가면서 계속 이동을 하게 됩니다.
원경을 만들었으니 이제 근경을 만들어보도록 하겠습니다. 사이즈 1024x1024의 빈 바탕화면에 구름을 몇개 배치해서 sky0으로 파일 이름을 설정하고 프로젝트 탭의 Resources파일에 넣도록 하겠습니다. 어떻게 프로그램에 적용이 되는지 확인하기 위한것이니 조금 허접해도 이해해 주세요.
원경1을 복사해서 근경1로 이름을 바꾸고, 머티리얼을 하나 추가해서 이름을 sky0으로 해서, 위의 sky0을 할당하겠습니다. 그리고 나서 이것을 근경1에 적용하겠습니다.
근경 1에 적용했는데도....구름이 보이지 않습니다. 그건 머티리얼의 Shader가 Diffuse로 되어있기 때문인데요. 이걸[ TransParent▶ Diffuse]로 변경합니다. Diffuse는 오브젝트 전체에 매핑되는 것을 의미합니다.
다음과 같이 조금은 허접하지만..원경과 근경의 움직임은 확실히 구별할 수 있을 정도의 배경이
됐습니다.
이제 원경2를 복사해서 근경2로 이름을 바꾸고 머티리얼을 적용해서 근경이 원경보다 조금 앞쪾으로 오도록 z축의 좌표를 13정도로 설정하겠습니다. 다음으로 각각에 연결된 스크립트에서 speed를 원경은2, 근경은 5로 설정해서 원경과 근경의 움직이는 속도를 다르게 해서 실행을 해봤습니다.
배경까지 만들어 봤습니다. 다음 포스팅에 이어서 계속 할게요.
