[iOS] 2주차 - AutoLayout

AutoLayout

뷰의 위치와 크기를 정할 땐, Frame과 AutoLayout을 통해 지정할 수 있다.

이 둘의 차이를 알아보자.

 

Frame VS AutoLayout

Frame으로 뷰를 그리면, 어떤 해상도에서든 같은 크기와 같은 위치를 유지하기 때문에, 기종에 따라서 다르게 보일 수 있다.

모드 기기별로 해상도를 받아서 일일히 짜주는 게 아닌 이상 비효율적인 layout이다.

이 점을 보완하기 위해 등장한 것이 Auto Layout이다.

 

 

AutoLayout이란?

제약 조건(Constraints)에 따라  뷰 계층 구조에 있는 모든 뷰의 크기와 위치를 동적으로 지정하는 것

Frame처럼 좌표를 직접 정해주는 것이 아닌, 다른 객체를 이용해 ‘상대적'으로 제약(Constraints)을 주는 것이다.

→ 자세한 내용은 여기에서 확인 !

 

+) Intrinsic Content Size_컨텐츠의 본질적인 크기

자체적으로 크기를 가지고 있는 view들이 존재한다.

따라서 width, height를 지정해주지 않아도 오류가 나지 않는다.

	Intrinsic Content Size Width	Intrinsic Content Size Height
UIView	X	X
UISlider	O	X
UILabel, UIButton, UISwitch, UITextField	O	O
TextView, ImageView	Content에 따라 변화함	Content에 따라 변화함

 

 

 

+) Priority (우선순위)

- Hugging Priority : 두 오브젝트 중 하나가 “커져야"하는 상황일 때, 우선순위가 높은 것은 유지, 낮은 것은 늘어난다.

- Compression Resistance Priority : 두 오브젝트 중 하나가 “작아져야"하는 상황일 때, 우선순위가 높은 것은 유지, 낮은 것은 줄어든다.

 

 

Constraint의 요소

• Top
• Bottom
• Left & Leading
• Right & Trailing

+) Leading과 Trailing은 왼쪽 / 오른쪽 개념이 아니다.

→ Leading: Text가 시작되는 지점 / Trailing: Text가 끝나는 지점

 

 

 

Inspector 영역

이미지 출처: https://lxxyeon.tistory.com/10

 

SuperView vs SafyArea

SuperView는 기존에 설정되어있는 제일 큰 ? 기본 뷰 라고 볼 수 있다.

여기에 상태바, 내비게이션바, 탭바 등에 의해서 뷰가 가려지는 부분이 생기는 것을 방지하기 위해 처음에는 Top/Bottom Layout Guide가 제공되었다.

그러나, iOS11가 등장하며 위아래 뿐만 아니라 노치가 생김에 있어 왼쪽오른쪽에도 주의를 줘야하는 경우가 생겼다. 그렇게 생긴 것이 Safe Area이다.

---

REFERENCE

Frame VS AutoLayout : https://babbab2.tistory.com/133?category=932180

iOS) Auto Layout 정복하기 (1/5) - Auto Layout이란?

Intrinsic Content Size & Priority : https://babbab2.tistory.com/135?category=932180

iOS) Auto Layout 정복하기 (3/5) - IntrinsicContentSize, Hugging Priority/ Compression Resistance Priority

Safe Area : https://babbab2.tistory.com/134?category=932180

iOS) Auto Layout 정복하기 (2/5) - Safe Area란?