← 글 목록

notes

iOS - Auto Layout

iOS Auto Layout 제약조건·우선순위와 화면 반응형 배치 메모.

스토리보드에서 빨간 선 잔뜩 뜨길래 Auto Layout이 “마법”인 줄 알았는데, 결국 제약식 풀이다. 화면 크기·회전·다국어 길이 변화에 뷰 위치/크기를 식으로 고정한다.

핵심 단어

  • Constraint: leading/trailing/top/bottom, width/height, center
  • Intrinsic Content Size: 라벨·버튼이 글자만큼 원하는 크기
  • Safe Area: 노치·홈 인디케이터 피한 영역 — 여기에 맞추는 버릇

코드로 중앙 버튼

button.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(button)
NSLayoutConstraint.activate([
    button.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    button.centerYAnchor.constraint(equalTo: view.centerYAnchor),
    button.widthAnchor.constraint(equalToConstant: 200),
    button.heightAnchor.constraint(equalToConstant: 50)
])

translatesAutoresizingMaskIntoConstraints = false 안 끄면 오토리사이징 마스크가 제약과 싸운다. 이거 때문에 한나절 날린 적 있음.

위아래 라벨

NSLayoutConstraint.activate([
    label1.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 40),
    label1.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    label2.topAnchor.constraint(equalTo: label1.bottomAnchor, constant: 20),
    label2.centerXAnchor.constraint(equalTo: view.centerXAnchor)
])

IB에서

  • 뷰 선택 → Add New Constraints
  • 간격·크기 입력 → 파란 선이 “만족”, 빨간 선이 “충돌/부족”
  • Priority(1000 required vs 750)로 줄 바꿈 대응

SwiftUI로 가면

Spacer, padding, frame이 제약을 대신한다. UIKit 레거시·SDK 래퍼에서만 Auto Layout을 깊게 판다.