autolayout - constraints 정리 (1)

autolayout  - constraints 정리

 

xcode storyboard에는 constraints라는 개념이 있다. 영어로 번역하면 제약이라는 뜻인데, 번역을 해도 이해가 잘안간다. 쉽게 말하면 storyboard에서 view의 간격을 자동으로 조정해 주는 역할을 한다.

 

 

1.문제상황

 

아이폰 11 과 아이폰 8

 

위 그림처럼 뷰를 제약조건없이 그리면 아이폰 사이즈에 따라서 뷰가 화면 밖으로 나갈 수 있다. 그래서 아이폰 전체 기종의 크기를 지원할려면 autolayout의 constraints 는 필수로 지정해야 한다.

 

2.주의점

constraints을 지정할 때 주의점이 있다. 뷰의 높이나 넓이 등 크기가 명확해야 한다는 것이다. 가로 높이가 명확해야 하고, 세로 높이가 명확해야 한다. 또는 x 좌표나 y좌표가 명확해야 한다. 아래 그림을 보면 뷰의 제약 조건을 탑, 왼쪽, 오른쪽만 주었다. 그래서 오류 메시지가 높이에 대해서 모르겠으니 높이를 알수 있게 해달라고 출력된다. 왼쪽, 오른쪽 constraints이 있어서 가로 길이는 명확한데, 아래 constraints이 없어서 뷰의 높이가 명확하지 않다.

 

constraints 주의점

 

그래서 뷰를 그릴때 반드시 xcode가 크기를 명확히 알 수 있게 해야 한다. 그럼 만약에 왼쪽 constraints이 없으면?

x좌표나 가로길이를 명확하게 해달라고 오류를 출력할 것이다.

 

 

 

3.constraints 설정

constraints 제약조건을 잘 설정했다면 아래 그림과 같이 오류 없이 뷰가 잘 출력되는 것을 볼 수 있다. 제약 조건을 설정하면 큰 기종의 아이폰이든 작은 기종의 아이폰이든 다 지원을 할 수 있다.

 

constraints 설정