본문 바로가기
게임메이커(GMS2) 강좌/횡스크롤

GMS2 강좌 5. 카메라와 뷰포트

by RainbowStudio 2019. 2. 2.
반응형


안녕하세요~ 오늘의 강좌는 카메라 와 뷰포트 입니다


일단 저번시간까지해서 맵타일그리기, 이동, 점프까지 해봤구요


오늘은 카메라와 뷰포트에 대해서 진행해보겠습니다



먼저 게임메이커내에서 카메라란?



<이미지는 게임메이커 사이트에서 가져왔습니다>



위 이미지에서 보이는 것 처럼 카메라는 전체 룸에서 특정하게 지정한 영역을 보여주는 역할을 하고

실제 룸사이즈가 10000 x 10000 사이즈라 해도 카메라영역을 500 x 500 만 지정하면 그 영역만 보이게 됩니다



실습을 통해 배워보도록 할게요





룸사이즈를 이미지에 맞게 바꿔주고 타일을 새로 배치했고

저렇게 룸사이즈를 정해준건 타일크기가 16x16 사이즈라 맵을 그릴때 딱 맞게 그려질수있게 설정해준거에요 992 는 타일이 62개 들어가고 , 496은 타일이 31개 정확히 들어가니까요



실행해보시면...




이렇게 룸전체가 보이실텐데 아직 카메라와 뷰포트를 설정해주지 않았기 때문이고 

이제부터 본격적으로 카메라와 뷰포트에 대해서 알아보겠습니다






좌측하단 룸설정에서 Viewports and Cameras -> Enable Viewports를 체크,

Viewport 0 -> Visible 를 체크 해줍니다


Viewport 0 은 첫번째 카메라를 말합니다 1은 두번째 카메라를 의미합니다



Visible를 체크하고 룸을 보시면 

위 이미지처럼 카메라가 보여주는 영역을 흰색선으로 그려줍니다


그럼 카메라 설정을 바꿔서 한번 보겠습니다





카메라 설정값에서 x Pos 는 카메라의 x 좌표 위치, y Pos는 카메라의 y좌표 위치, Width는 넓이, Height는 높이값을 의미합니다 


Camera Properties 값과 Viewport Properties 값을 이미지와 같이 한번 수정해보고 실행해보겠습니다



잘 보이시나요?



요오오오오~~~~~~~~용~!



이렇게 화면이 보이는건 뷰포트와 카메라의 설정값이 이상하게 설정됐기 때문인데요


뷰포트는 보여주는 화면 크기를 의미하고 카메라는 화면에 보여주는 영역을 담당하기 때문에 위 설정값의 의미를 풀어서 해석하면 


[100 x 768 의 화면 속에 300 x 200사이즈의 카메라 영역을 그려주겠다]


정도로 해석해볼수있겠네요



Viewport Properties 값을 300 x 200 으로 수정하면 화면은 작아도 정확하게 잘 나오시는걸 볼수있습니다 300 x 200으로 수정하면 의미가 잘 맞아떨어지기 때문이죠

[300 x 200 의 화면 속에 300 x 200사이즈의 카메라 영역을 그려주겠다] 이렇게 의미가 일치가 되기때문에 화면이 문제없이 나오게 됩니다


그런데 카메라와 뷰포트 크기를 계속 일치시키면 어떤 문제가 생길까요?


그냥 볼땐 문제가 없어보이지만 뷰포트를 크게 수정하면 카메라도 크게 수정하고 이렇게 하다보면

내가 보여주고 싶은 카메라 영역을 큰 화면에서 정확하게 보여줄순 없을까? 라는 의문을 던지게 되실텐데요 그래서 그것까지 진행해볼게요 의외로 이런 내용은 좀처럼 찾아보기 어렵더라고요



# 내가 보여주고 싶은 카메라영역을 큰화면에서 정확하게 보여주기



뷰포트 사이즈가 내가 보여주고 싶은 크기를 의미하니 좀 크게 보여주겠습니다


먼저 Viewport Properties 값을 960 x 540 으로 수정해주겠습니다

뷰포트 사이즈를 수정했으면 이제 생각해봅시다


카메라 사이즈를 어떻게 설정하면 보여주고 싶은 영역을 더 크게 보여줄수있을까?

960 x 540 뷰포트에서 카메라 사이즈를 뷰포트의 절반으로 줄인다면?




y pos 값은 영역내에 보이는 부분이 있어야 하기때문에 임시적으로 설정해줬고 카메라 사이즈를 뷰포트의 절반값으로 설정해주고 실행해봅시다





와우!! 큰화면에서 카메라영역이 2배 확대되어 정확하게 보여지네요! 



카메라를 뷰포트의 절반으로 설정하면 카메라의 영역은 2배 확대되어 보여지는걸 확인하실수있습니다


그래서 해상도를 맞출때 해상도값 기준으로 설정을 해줍니다


1920 x 1080 의 해상도에 화면을 맞출때   (1920 / 1080 은 1.777777777777778)


960 x 540  -> x2 (960 / 540 은 1.777777777777778)


480 x 270  -> x4 (480 / 270 은 1.777777777777778)


수치를 맞춰주면 정확하게 확대되어 보이게 됩니다




확인해볼겸 지금 상태에서 전체화면(1920 x 1080 모니터 해상도)으로 확인해보겠습니다


전체화면 설정은...



우측 메뉴하단에 Options -> Windows






Graphics -> Start fullscreen 을 체크해주시면 실행시 전체화면으로 나옵니다



 


아무 문제 없이 화면이 보이는걸 확인하실수있습니다



이번 강좌는 여기에서 끝내고 다음에 뵙겠습니다~ 

행복하고 풍성한 명절보내세요~ :)

반응형

댓글