Hugging Priority
AutoLayout 에 대해 공부하던 중, Hugging Priority Attribute 는 왜 있는거고 어디에 쓰이는지 궁금해졌다.
다음과 같이 두 개의 텍스트 라벨이 있는 화면을 생각해보자
위에서 회색 배경을 가진 라벨에 좌측 상단으로부터 20 포인트 씩 떨어져있는 제약조건을 추가해보자.
그리고 노란색 배경을 가진 라벨에 좌측, 상단, 우측으로부터 20포인트 씩 떨어져있는 제약조건을 추가해보자.
그러면 우리는 위와 같이 에러가 뜨는 것을 볼 수 있다. 에러 메시지를 살펴보도록 하자.
Yellow Label 의 Hugging Priority 를 251에서 250으로 낮추라는 메시지를 볼 수 있다. 이것이 무슨 뜻일까??
우리가 회색 라벨에 좌측 상단 20포인트 제약조건을 추가하고, 노란색 라벨에 좌측 상단 우측 20포인트 제약조건을 추가해주었다. 그렇다면 두 개의 라벨 중 하나의 라벨의 크기가 커져야 모든 제약조건을 만족할 수 있을 것이다. 왜냐하면 위 상황에서 노란색 라벨이 우측으로부터 20포인트 떨어져야 할 때, 노란색 라벨이 커지든지 회색 라벨이 커지든지 해야 이 제약조건이 만족되기 때문이다. 위 이미지에서 노란색 라벨의 우측 제약조건은 20포인트 보다 훨씬 큰 것을 알 수 있다.
즉 두 개의 라벨 중 어떤 라벨의 크기가 커져야 하는지 AutoLayout 이 판별을 못하는 상황이라서 에러가 발생하는 것이다. 이 상황을 해결해보자!
Hugging Priority 설정하기
우리가 위와 같이 제약조건을 추가해보면, 우측 사이즈 인스펙터에서 Hugging Priority 를 볼 수 있다.
우리는 위 상황에서 Width 에 관해 추측할 수 있는 단서를 주어야 하기 때문에, Horizontal Hugging Priority 를 설정해보자. 값이 높을수록 우선순위가 높아지는데, 우선순위가 높아진다는 뜻은 자기의 본래 크기를 유지한다는 것이다.
좌측에 있는 회색 라벨의 Hugging Priority 를 250 으로 낮추어보자
회색 라벨의 우선순위를 250으로 낮추었다. 그러나 여전히 노란색 라벨의 우선순위는 251이다. 즉 회색 라벨의 우선순위가 더 낮기 때문에, 노란색 라벨의 크기는 유지되고 회색 라벨의 크기가 늘어난 것을 볼 수 있다.
이번엔 반대로 노란색 라벨의 우선순위를 회색 라벨보다 낮추어보자!
이번엔 반대로 노란색 라벨의 Width 가 고정되지 않고 늘어난 것을 볼 수 있다. 노란색 라벨의 Hugging Priority 가 회색 라벨보다 낮기 때문이다.
결론
결론은 제약조건을 만족하기 위해서 View 들의 크기가 늘어나야 할 때, 어떤 View 의 크기를 늘려서 제약조건을 맞출지를 결정하는 게 Hugging Priority 라고 생각된다. 우선순위가 높은 View 들은 자기의 원래 넓이를 유지하고, 우선순위가 낮은 View 들은 자기의 원래 넓이를 유지하지 못하고 제약 조건에 맞추어 넓이가 변경되는 것이다.
'UIKit > Storyboard' 카테고리의 다른 글
| AutoLayout - Compression Resistance Priority (0) | 2022.05.18 |
|---|
Comment