Computer >> 컴퓨터 >  >> 프로그래밍 >> iOS

iPhone 5 화면 해상도에 맞춰 앱을 개발·마이그레이션하는 방법


iPhone 5 해상도 대응이 필요한 이유

iPhone 5가 출시되었을 당시 640 x 1136픽셀이라는 새로운 해상도와 종횡비가 적용되면서, 기존 iPhone 4 크기로 제작된 앱을 새 기기에 맞게 마이그레이션하는 작업이 상당히 까다로웠습니다. 하지만 이후 iOS 8에서 사이즈 클래스(Size Classes)와 추상화된 화면 크기 개념이 도입되면서 상황이 크게 개선되었고, 현재는 Xcode 스토리보드 에디터만으로 거의 모든 화면 크기에 대응하는 앱을 개발할 수 있습니다.

스토리보드 에디터를 사용하는 방법 외에도, 런치 이미지(Launch Image)를 변경하여 대응하는 방법이 있습니다. 각각의 방법을 하나씩 살펴보겠습니다.

방법 1: 런치 이미지 변경하기

가장 먼저 런치 이미지를 Default-568h@2x.png로 변경하고, 이미지 크기를 1136x640으로 설정합니다.

그다음 info.plist 파일을 열어 "Launch Image" 항목의 값을 삭제합니다. 이렇게 하면 시스템이 새로운 해상도의 런치 이미지를 인식하여 iPhone 5 화면 전체 크기로 앱을 실행하게 됩니다.

방법 2: 오토 레이아웃(Auto Layout) 활용하기

스토리보드 에디터에서 오토 레이아웃을 사용하면 어떤 화면 크기에도 디자인이 자동으로 맞춰지도록 만들 수 있습니다. 오토 레이아웃을 적용하면 개발자가 지정한 제약 조건(Constraints)에 따라 모든 화면 크기에서 UI가 의도한 대로 유연하게 배치됩니다.

먼저 스토리보드 에디터를 실행합니다.

iPhone 5 화면 해상도에 맞춰 앱을 개발·마이그레이션하는 방법

에디터 하단의 "View as" 옵션에서 iPhone 5를 선택합니다. 참고로 Xcode 10 기준으로는 "View as" 옵션에서 iPhone 4, iPhone SE, 그리고 iPhone 8 이상 모델만 지원됩니다.

선택한 iPhone 모델을 기준으로 오토 레이아웃을 적용해 디자인하면, 스토리보드에서 실시간으로 렌더링 결과를 확인할 수 있습니다. 실제 기기에서도 스토리보드와 동일하게 표시되며, 그 외 다른 기기에서는 추가된 오토 레이아웃 제약 조건에 따라 비슷한 형태로 화면이 구성됩니다.