[Swift] iOS AutoLayout

 

AutoLayout

다양한 디바이스, 화면 방향에 따라 유연하게 UI를 배치하고 조정한다

 

크기에 따른 반응형 조정이 없다면, 오른쪽같이 storyboard와 다른 화면에서 출력 될 때는 전부 깨져서 나올 수 있다

 

 

제약 조건 (Constraints)

• 뷰와 뷰 사이의 관계를 나타낸다
• 뷰의 위치와 크기를 결정하는 데 사용
• 뷰의 상대적인 위치를 설정

우측 하단에 있음

 

ㄴ Add New Alignment Constraints

 

각 값을 0으로 두면 가운데 정렬을 할 수 있다

이렇게 정렬하면 아이패드와 같은 화면에서도 가운데에 정렬이 된다

 

ㄴ Add New Constraints

 

 

 

오토레이아웃 엔진 (AutoLayout Engine)

• 제약 조건을 기반으로 뷰의 최종 위치와 크기를 계산
• 다양한 화면 크기와 방향에 대응할 수 있는 유연한 UI를 구현 가능

 

 

 

Size Classes

• 사이즈 클래스는 화면 크기와 방향에 따른 뷰의 레이아웃을 관리
  • Compact
  • Regular
• 다양한 화면 크기와 방향에 대응할 수 있는 레이아웃을 구성

 

 

 

Interface Builder(Storyboard)

• Autolayout을 사용하여 UI를 시각적으로 디자인할 수 있는 툴
• 제약 조건을 추가, 수정, 삭제하는 것이 가능
• 뷰의 레이아웃을 실시간으로 확인 가능