오토레이아웃을 코드로 작성하는 방법은 무엇인가? (3가지)

오토레이아웃을 코드로 작성하는 방법에는 3가지가 존재한다.

1. NSLayoutConstraint
2. NSLayoutAnchor
3. VFL(Visual Format Language)

 

여기서 잠깐!!

스토리보드에서 오토레이아웃을 잡을 때에는 translatesAutoresizingMaskIntoConstraints 속성이 자동으로 false로 반영된다. 하지만 코드로만 개발을 할 때에는 그렇지 않기 때문에 translatesAutoresizingMaskIntoConstraints = false를 직접 써줘야 한다.(SnapKit 라이브러리 사용 시, 자동으로 반영된다.)

 

---

 

1. NSLayoutConstraint

• 속성값이 길고 직관적인편이나 코드가 길어지게 되면 가독성이 떨어진다는 단점이 있다.

NSLayoutConstraint(item: myView, 
		attribute: .leading, 
		relatedBy: .equal, 
		toItem: view, 
		attribute: .leadingMargin, 
		multiplier: 1.0, 
		constant: 0.0).isActive = true

 

2. NSLayoutAnchor

• 가장 많이 쓰이는 코드 방식이다. + 사용성을 위해 SnapKit 라이브러리와 함께 활용 가능하다.
• NSLayoutConstraint의 가독성 측면의 단점을 보완하기위해 Apple이 새롭게 내준 방식이다.
• 코드의 길이가 길어지긴 하지만 가독성이 좋아졌다.

NSLayoutConstraint.activate([
	alertView.centerYAnchor.constraint(equalTo: window.centerYAnchor),
	alertView.leadingAnchor.constraint(equalTo: window.leadingAnchor, constant: 20),
	alertView.trailingAnchor.constraint(equalTo: window.trailingAnchor, constant: -20),
])

 

3. VFL(Visual Format Language)

• 기호 및 문자열로 레이아웃 관계를 시각적인 표현으로 제공하는 방식이다.
• 뷰는 대괄호로 표시되고 뷰간의 연결은 하이픈(또는 뷰들을 떨어뜨리는 숫자에 의해 두개의 분리된 하이픈)을 사용한다.
• NSLayoutConstraint를 이용해서 생성한다.
• 사용이 익숙해지면 편리하지만, 사용을 위해 VFL만의 문법을 익혀야한다는 단점이 존재한다.

let views = ["myView": myView]
let formatString = "|-[myView]-|"
let constraints = NSLayoutConstraint.constraintsWithVisualFormat(formatString, 
    options: .AlignAllTop, 
    metrics: nil, 
    views: views)

NSLayoutConstraint.activateConstraints(constraints)

3-1. Parameter Description

Format	제약 조건을 시각적 형식으로 나타낸 문자열
options	객체들의 속성, 레이아웃 방향 설명
metrics	상수 집합. 키는 문자열, 값은 NSNumber 객체
views	뷰 집합. 키는 문자열, 값은 뷰 객체

 

---

참고

[Swift] AutoLayout 코드작성방법 (Visual Format Language, NSLayoutAnchor, NSLayoutConstraint)