오늘은 AutoLayout의 특성 중 하나인 Size Classes에 대한 포스팅이다.

하나의 Interface로 아이폰, 아이패드와 같은 다양한 화면에서 사용하고자 할 때,

또는 splitView를 사용하고자 할 때,

개발자는 화면에 맞는 유연한 AutoLayout을 원한다.

이때, 사용되는 개념은 Size Classes이다.

Size Classes란?

Scene이나 View와 같은 사용자 인터페이스에 할당된 특성이다.

Size Classes에는 Height와 Weight가 존재한다.

Height는 높이, Weight는 너비를 나타내는데,

각각엔 2가지 요소가 존재한다.

1. Compact

2. Regular

Regular는 큰 길이, Compact는 작은 길이를 나타낸다.

그래서 4가지의 View 크기를 가진다.

• Regular width, regular height
• Compact width, regular height
• Regular width, compact height
• Compact width, compact height
  
  
  

기기에 따른 Size Classes

애플 공식 문서에서 Device에 따른 Size Classes를 정리해서 보여준다.

아래의 링크를 들어가면 더 많은 device를 볼 수 있다.

Layout | Apple Developer Documentation

Size Classes 종류

어떻게 Interface에 Size Classes를 적용하여 Device에 맞는 AutoLayout을 구현하는지 알아보자.

Interface Builder는 9가지의 View 크기를 인식할 수 있다.

Any 라는 요소는 Compact와 Regular 두 가지 모두를 인식할 수 있다.

• Regular width, regular height
• Compact width, regular height
• Regular width, compact height
• Compact width, compact height
• Compact width, any height
• Regular width, any height
• Any width, compact height
• Any width, regular height
• Any width, regular height

이때, 개발자가 Regular width, regular height 의 설정과, Regular width, any height 의 설정을 했다면 더 구체적으로 설정된 Regular width, regular height 의 설정을 우선시하여 적용한다.

Size Classes 적용하기

apple이 개발자에게 제시하는 Size Classes 구현방법

개발자는 기본적인 Class를 포함한 9가지의 Size Classes에 대해서 모호하지 않고, 명확한 레이아웃을 설정해야한다. 따라서, 가장 일반적인 크기의 Class에서 가장 구체적이고 명확하게 레이아웃을 설정하는 것이 가장 쉽다. 앱의 기본 레이아웃을 선택하고 이 레이아웃을 Any-Any 크기 클래스에서 설계한다. 그런 다음 필요에 따라 다른 기본 또는 최종 크기 클래스를 수정한다.

Inspector에서 Installed 옆의 + 아이콘을 통해서 개발자가 원하는 Width와 Height를 정해 설정할 수 있다.

기본적으로 개발자는 Width: Any, Height: Any 사이즈 설정에서 Layout을 설정할 수 있고,

• 아이콘과 - 아이콘을 통해서 Size Classes를 추가하거나 삭제할 수 있다.