[📜일지] 피그말리온 #51 : 해상도 작업

[team_ca..(teamcandle)]

모바일 버전을 제작하면서 UI 작업에 시간을 제법 소요했다.

오늘은 특히 해상도에 대한 내용을 다뤄보고자 한다.

PC 버전을 작업할 때도 다양한 해상도 비율에 대응할 수 있도록 작업할 수 있도록 제작했지만, 모바일 버전을 제작할 때는 또 다른 문제들이 있었다.

기존 화면 해상도 창

특히 안드로이드의 경우 덱스, 분할 화면, 팝업 화면 등으로 게임을 하는 경우도 있어서 해당 상황에 대해서도 일일히 대응해야 했다.

그래서 작업을 하는 김에 PC 버전에서도 창 크기를 자율적으로 조절해도 상황에 맞게 UI를 대응할 수 있도록 작업을 진행해봤다.

PC 버전 수정 후

창모드 일 때는 커스텀을 포함해 지정된 해상도 크기를 선택할 수 있다.

물론 대응할 수 없는 지점이 있어서 해상도 제한을 걸어 놓긴 했다.

윈도우 창일 때 비율에 따라 특정 비율을 넘지 못하고, 최소 해상도를 설정해서 이 이하로 윈도우 크기가 작아지지 않는다.

가로 최대 일 때. 이 이상으로 커질 수 없게 제한을 걸어 두었다.

마찬가지로 일정 이상 작게 드래그해도 작아지지 않는다.

또한 픽셀 게임이다 보니 전체 화면일 때는 해상도보다는 화면 비율(16:10, 16:9 등)로 표시해 두었다.

전체 화면일 때는 자동(오토)으로 모니터 비율에 맞춰주며, 필요하면 비율을 변경할 수 있다.

안드로이드에서는 PC의 전체 화면과 비슷하게 처리했다.

이런 식으로 우리가 지정한 화면 비율 이상일 경우 레터박스로 처리된다.

사실 전부 대응하게 처리하고 싶었지만 예외도 너무 많아서 대부분 게임이 레터박스로 빈 부분을 처리하는 경우가 많았다.

PC 버전은 작업용 컴퓨터와 노트북으로 충분히 여러 해상도를 실험해볼 수 있었으나, 모바일의 경우 태블릿을 포함 다양한 기종이 있다보니 최대한 많은 표본이 필요했다.

그래서 몇개는 공기계를 직접 구하고 몇개는 무료 대여해주는 지원 사업 등을 이용해서 작업했다.

지원 사업을 통해 빌린 태블릿과 휴대폰, 입주 기업이 아닌 경우 현장에서 밖에 테스트 할 수 없어서 하루 날을 잡아서 여러 대를 다 실험해봤다.

태블릿에서 문제 없이 실행됨을 확인.

가로일 때 분할 화면도 잘 대응된다.

플립 같은 접는 폰에서 세로 화면으로 분할 하거나 팝업 화면으로 해도 문제가 없음을 확인했다.

이후 폴드에서도 정상적으로 작동 되는 것을 확인해봤다.

접은 상태에서 화면

폈을 때도 바로 화면이 적용된다.

분할 화면에서 화면비 적용 상황

팝업 화면에서도 정상적으로 작동된다.

다음 편에 계속…(캔들은 항상 열려있습니다.)

[익명(cord6902)]

[익명(prose5515)]

근황이나 업데이트 내용같은거 스팀쪽에도 업로드 해주시면 안될까요 - dc App

[team_candle(teamcandle)]

조만간 정리해서 한꺼번에 올려보도록 할께요 .ㅠㅠ

[sdf(symphony1272)]

[Indie 1(218.39)]

폰으로 출시하면 탭이랑 크기별로 다 있어야겠네

[team_candle(teamcandle)]

수도권이면 대여해주는 곳이 많으니 여러기종으로 테스트를 해볼 수 있어요!

[익명(confine5723)]

중간에 마개조된 맥북이 보이는데

[team_candle(teamcandle)]

[team_candle(teamcandle)]

돈없는 개발자는 중고맥북으로 근근히 버틴다는...

[비월(lunar1228)]

난 그냥 동적해상도 포기했는데 ㄷㄷ

[team_candle(teamcandle)]

사실 안하는게 좋아요. 이거 넘 힘들어요 ㅠ

[무장농부(weight5377)]

UI 넘 이쁘네

[team_candle(teamcandle)]

[NewPattern(gross5212)]

모바일에서 화면 비율 바뀌는거 어떻게 감지 했습니까? - dc App

[team_candle(teamcandle)]

안드로이드에서는 View에 Layout이 변경되었을때 리스너로 콜백하는 방식으로 감지했습니다. iOS는 개발시점(iOS18) 에는 멀티윈도우가 지원이 되지 않아서 그냥 전체화면값을 비율로 가져왔습니다.