adsense



[JAVA/slick2d] 2D 슈팅게임 위치즈 스크램블 제작강좌 -step 3-


step 3. GameScene을 추가했습니다.


TitleScene은 그전에 작업했던 내용을 지우고, 스페이스키가 입력되면 GameScene으로 변경하는 내용을 넣었습니다.

타이틀 화면에는 대단한 내용이 없기 때문에, 그림을 굳이 GameObject로 올리지 않고 render에 바로 코딩해도 됩니다.
물론 아 간단하게 처리하자 이런 식으로 조금씩 조금씩 메인 코드에 추가하는 내용은 미래에 댓가를 치루게 됩니다만..


이제부터 GameScene에 내용을 넣도록 하겠습니다. GameScene에 들어가는 내용은 GameObject를 사용하는 것을 기본으로 할 것입니다.

게임화면에 등장할 내용은

1. 배경
2. 플레이어 캐릭터
3. 플레이어 2 캐릭터 -> 합니다. 2인용...!
4. 적 캐릭터 (블럭형, 네우코, 보스)
5. 플레이어 총알
6. 적 총알
7. 이펙트
8. 게임 오브젝트보다 앞에 오는 배경(구름)
9. 게임 정보(UI)


이와 같이 됩니다.
여기 기재한 순서의 역순으로 화면 위에 오게 되는데, 플레이어캐릭터~적총알 까지는 동일한 zorder라도 무방할 듯 합니다.

참고로, 플레이어 2 캐릭터는 게임패드로 콘트롤할 것이며, 게임 중에 패드의 버튼을 눌러 난입하는 방식으로 추가하게 됩니다.



우선은 상호작용이 없는, 배경화면을 먼저 구현해보겠습니다.



배경화면은 한 장의 원경(구름 배경)이 있고, 이 그림을 좌우 반전한 그림을 옆으로 이어, 아주 느리게 오른쪽에서 왼쪽으로 이동시킵니다.
화면 왼쪽 밖으로 사라진 그림은 오른쪽 끝에서 나타납니다.

작은 구름 조각들이 멀리 있는 것은 느리게, 가까이 있는 것은 빠르게 오른->왼쪽으로 이동하고, 밖으로 나가면 다시 오른쪽으로 이동합니다.

배경화면 - 작은 구름(cloud2) - 작은 구름 2열(cloud3) - 중간 구름(cloud1)

cloud0은 보통의 캐릭터보다 더 앞에 오게 됩니다. 구현은 동일하고 zorder를 제일 큰 것으로 지정하면 됩니다.


원경과 좌우 플립된 원경, 각 종류의 구름을 각각 다른 클래스로 만드는 방법도 있겠지만, 공통적으로 쓸 수 있는 부분이 많으므로
원경과 플립된 원경을 통합한 BackGround 클래스와,
모든 종류의 구름을 하나로 통합해서 Cloud 클래스로 작성하도록 하겠습니다.



나중에 구분하기 편하도록, prefab에 background라는 이름으로 패키지를 추가, prefab.background 패키지를 만들어 백그라운드용 클래스는 이곳에 생성합니다.
우선 GameObject를 상속하는 BackGround 클래스와 Cloud 클래스를 만듭니다.
(그동안 테스트용으로 사용한, prefab 하에 있던 Cloud 클래스는 삭제합니다)

각 클래스는, 사용되는 그림을 격납하기 위한 Image, 움직이는 속도를 정하는 float 변수를 추가로 갖습니다.
원경은 거기에 더해서 이미지의 플립 여부를 지정할 수 있는 boolean 변수를 가집니다.



생성자에서 이미지를 읽도록 하고, render에서 해당 이미지를 그려주도록,


update에서 speed에 따라 좌표를 변경해 주다가 화면 밖으로 사라지면 오른쪽 끝으로 되돌려줍니다.


구름은, 구름의 종류를 지정할 수 있는 생성자를 추가, 이 종류에 따라 생성자 안에서 그림과 속도, zorder를 다르게 지정해줍니다.

나머지는 객체로 생성해서 GameScene에 addChild 해 주기만 하면 됩니다.
GameScene의 createBackGround 함수를 봅니다.



원경은 두 개를 만들어서 하나는 화면 전체에, 하나는 화면 바깥에,
구름은 크기별로 만들어주는 갯수와 간격을 각각 다르게 했습니다.

이제 GameScene에 들어오면 원경과 구름은 자동으로 흘러갑니다.



※원경(BackGround)의 경우, 되돌려주는 위치가 640이 아닌 639로 1도트 적게 잡혀있는데, 이렇게 딱 맞물려야 하는 배경은 좌표를 float로 계산하기 때문에 640으로 잡아주면 이미지와 이미지 사이가 맞물리지 않고 미묘한 공백이 생기는 수가 있습니다.
이것은 일종의 편법이고, 타일맵같은 것을 구현하거나 할 때는, 별도의 이미지 버퍼를 사용합니다.

※createBackGround에 boolean bgmode = true; 라는 줄이 있는데, 이것을 false로 하면 Cloud 대신 WaveBg라는, 따로 만들어 둔 배경처리용 클래스를 사용합니다.
어떤 효과가 나타나는지는 한 번 테스트해 보세요.
옛날 '라인스크롤'이라고 불리던 건데, 비디오 주사선 콘트롤하던 그것과는 달리 무식한 방법으로 효과만 흉내낸 물건입니다.
지금 설명하기에는 타이밍이 맞지 않고, 본편에서 쓸지 안쓸지는 미묘한지라 설명은 언젠가..




핑백

덧글

댓글 입력 영역


Books

Geek라이프

메가 드라이브 퍼펙트 카탈로그
마에다 히로유키 저/조기현 역

미소녀 일러스트 테크닉
B-은하, pen스케, 카와이 저/정유진 역

핵심강좌! Cocos2d-x
이재환 저

피규어의 교과서 레진 키트 & 도색 입문 편
후지타 시게토시 저/김정규 역
예스24 | 애드온2
일본서적 전문사이트 NEPIC