hugging, compression resistance에 대해서

뷰에 label이 가로로 2개 있다고 가정하고 label의 텍스트가 고정되지 않고

leftLabel은 좌측, 상단에 오토레이아웃이 잡혀있고

rightLabel은 우측, 상단에 오토레이아웃이 잡혀있고

leftLabel의 좌측과 rightLabel의 우측에 오토레이아웃이 연결되어 있다고 가정했을때

 

let leftLabel = UILabel()
leftLabel.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(leftLabel)
leftLabel.text = "left label"

let rightLabel = UILabel()
rightLabel.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(rightLabel)
rightLabel.text = "right label"

NSLayoutConstraint.activate([
view.leadingAnchor.constraint(equalTo: leftLabel.leadingAnchor),
view.safeAreaLayoutGuide.topAnchor.constraint(equalTo: leftLabel.topAnchor, constant: -10)
])

NSLayoutConstraint.activate([
view.trailingAnchor.constraint(equalTo: rightLabel.trailingAnchor),
view.safeAreaLayoutGuide.topAnchor.constraint(equalTo: rightLabel.topAnchor, constant: -10)
])

NSLayoutConstraint.activate([
leftLabel.trailingAnchor.constraint(equalTo: rightLabel.leadingAnchor)
])

 

 

 

이렇게 만들게 된다.

여기서 leftLabel과 rightLabel의 영역을 보면

이렇게 leftLabel이 꽉차게 나온다.

rightLabel이 꽉차게 나오게 하려면 hugging를 변경하면 된다.

leftLabel.setContentHuggingPriority(UILayoutPriority(rawValue: 252), for: .horizontal)

 

텍스트가 길어졌을때는

leftLabel.text = "left label 🧡💛💚💙💜🖤"
rightLabel.text = "right label 🧡💛💚💙💜🖤"

 

이렇게 leftLabel이 먼저 다 보이고 나머지 공간에 rightLabel이 보이게 된다.

rightLabel이 먼저 다 보이게 하려면

compression resistance을 수정하면 된다.

leftLabel.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 749), for: .horizontal)

 

 

 

 

정리

 

Hugging은 슈퍼뷰의 크기가 서브뷰의 크기보다 큰 경우 서브뷰의 우선순위를 줘서
우선순위에 따라 영역이 컨텐츠에 대해 최소로 잡히거나
남은 영역에 대해 최대로 잡히게 할수있다.

Compression Resistance는
슈퍼뷰의 크기가 서브뷰의 크기보다 작은 경우 서브뷰의 우선순위를 줘서
우선순위에 따라 서브뷰 끼리의 컨텐츠 영역을 짤라서
더 많이 보이게 할수있다.