priority: 우선순위
내가 우선순위를 설정했다는 것은 여러개의 컴포넌트들이 화면에 있을 때 우선순위가 높은 것들이 먼저 크기, 위치가 지정이 되고 낮은 것들은 나중에 지정이 되는 것이다.
- Content Hugging Priority: 주어진 크기보다 작아질 수 있다.
- Content Compression Resistance Priority: 주어진 크기보다 커질 수 있다.
priority는 1부터 1000까지 설정할 수 있다. 수가 높을 수록 우선순위가 높은 것이다. 1000은 어떤 상황에서도 먼저 변화지 않는 상태를 만들어 놓는 것이다.
[Hugging priority 실습]
Content Hugging Priority: 주어진 크기보다 작아질 수 있다.
-
화면에 Label 두개를 놓는다.
-
첫 번째 Label의 Constraints를 top: 40, leading: 40, trailing: 40을 설정해준다.
2번을 해주면 두 번째 Label이 오류가 잡힌다.
그 이유는 첫 번째 Label에 의해서 x position은 잡혔지만 y position은 잡혀있지 않기 때문이다.
- 오류를 해결하기 위해서 두 번째 Label의 top: 40으로 잡아준다.
Constraints를 잡아줄 때 크기와 위치를 잡아주어야하는데 Label은 text 크기만큼 크기를 자동으로 설정이 되기 때문에 크기를 지정하지 않아도 에러가 뜨지 않는다.
그리고 현재 노란색으로 경고가 떠있는데 이건 화면에 보이는 대로 나오지 않거나 의도한대로 나오지 않을 수도 있다는 가능성을 열려주는 것이다.
경고 메세지! Trailing constraints is missing, which may cause overlapping with other views
이 경고창의 의미는 Trailing을 잡아주지 않았을 때 Label이 다른 컴포넌트와 겹칠 수 있으니 조심하라는 소리이다.
아래의 예시 참고
- 겹치는 상황을 방지해서 Trailing을 설정해보자. 두 번째 Label Trailing: 40
4번 처럼하면 다시 에러가 생긴다.
이제 priority에 대해서 알아보자.
[priority로 생긴 오류 - 2개]
priority는 컴포넌트의 Constraints를 잡고 사이즈 인스펙터로 가보면 나온다.
자 이제 오류가 왜 생긴지를 생각해보자.
두 Label의 Hugging Priority를 보면 251로 같은 것을 확인할 수 있다. 즉 우선순위가 같다는 것이다.
우선순위가 같다는 것은 Content의 크기를 동일하게 하겠다는 말이다. Constraints를 40씩 잡아 놓았기 때문에 한개의 Label의 사이즈가 커지든 작아지느 해야하는데 우선순위가 같아 어떤 것의 크기를 늘리고 줄여야할지 모르는 상황 때문에 오류가 생긴 것이다.
[priority로 생긴 오류해결]
a. 만약에 왼쪽 Label의 크기가 커지는 것이 안되는 경우
왼쪽 Label의 Content Hugging Priority의 수를 올려 오른쪽이 커지게 만든다.
-> 왜 왼쪽이 커지지 않고 오른쪽이 커지냐?
Content Hugging Priority의 수를 높였기 때문이다.
b. 만약에 오른쪽 Label의 크기가 커지는 것이 안되는 경우
오른쪽 Label의 Content Hugging Priority의 수를 올려 왼쪽이 커지게 만든다.
즉 우선순위를 설정하면 우선순위가 높은 것의 Constraint가 먼저 잡히고 그 이후에 나머지가 남겨진 위치에 맞춰서 자리를 잡는 것이다.
[priority로 생긴 오류 - 3개]
3개의 Label을 놓고 생각해보자.
-
2번 Label의 Trailing을 지우고 오른쪽에 새 Label을 놓는다.
-
1, 3번 Label은 top 40 leading 20 trailing 20으로 잡아준다.
-
1번 Label의 Hugging Priority를 250으로 해준다.
그러면 위처럼 오류가 사라지게 된다.
1번 Label: 250 / 2번 Label: 251 / 3번 Label: 251이라는 우선순위를 갖고 있다.
2번, 3번은 동일한 우선순위를 가지고 1번은 낮은 우선순위를 가지고 있기 때문에 우선적으로 2번, 3번이 본래의 크기를 유지하면서 우선적으로 위치를 잡고 상대적으로 순위가 낮은 1번이 위치를 잡지만 자신의 크기를 조절하며 Contraints가 잡히게 된다.
Hugging Priority - 상대적으로 낮은 우선순위를 가진 것이 높은 것보다 크기가 커지게 된다.
[Compression Resistance 실습]
Content Compression Resistance Priority: 주어진 크기보다 커질 수 있다.
- 두개의 Label을 놓고 Constraints를 top: 20, leading: 20, trailing: 20을 설정해준다.
Content Compression Resistance Priority는 내 크기보다 더 큰게 나타나서 내가 찌그러지거나 압축되는 상황을 제어하려고 할 때 사용하는 것이다.
- 이제 위의 상황을 만들기 위해서 1번 Label의 content양을 늘려보자.
이런식으로 1번의 Label content양을 늘리면 오류가 뜨게 된다.
그 이유는 1번 Label content양이 많아져서 2번 Label의 크기를 줄이던지 1번 자기 자신의 크기를 줄일 것인지 우선순위가 같아서 결정하지 못해서 생긴 오류이다.
이것을 결정하는 것이 바로 Compression Resistance이다.
즉, 우선순위가 높은 것이 찌그러지지 않고 낮은 것은 찌그러지게 되는 것이다.
- 1번 Label의 Compression Resistance 값을 높여 2번을 압축시키자.
Compression Resistance - 상대적으로 낮은 우선순위를 가진 것이 높은 것보다 크기가 작아지게 된다.
[Constraints Priority 실습]
Constraints에서의 Priority는 기본 값이 1000이다.
-
Label두개를 놓고 Constraints를 top: 20, leading: 20, trailing: 20을 설정해준뒤 1번 Label의 Hugging priority를 높인다.
-
1번 Label의 leading priority를 249로 해준다.
그렇게 하면 아래와 같이 바뀌게 된다.
이렇게 바뀐 이유는 1번 Label의 Hugging priority가 252로 제일 높고 2번 Label의 Hugging priority가 251으로 그다음으로 높고 1번 Label의 leading priority 249로 가장 낮기 때문이다.
1번 Label의 Hugging priority > 2번 Label의 Hugging priority > 1번 Label의 leading priority
그렇기 때문에 1번 Label이 자기 크기를 유지하면서 위치를 잡고 2번도 마찬가지로 자기 크지를 유지하면서 위치를 잡고 마지막으로 1번 Label의 leading constraint가 위치를 잡게 된다.
이렇게 label들이 자리를 다 잡은 상태에서 leading constraint 잡기 때문에 leading constraint의 값을 유지하지 못하고 크기가 늘어나게 된다.
