[예제] 오토레이아웃

출처 : https://developer.apple.com/library/archive/documentation/UserExperience/Conceptual/AutolayoutPG/ProgrammaticallyCreatingConstraints.html#//apple_ref/doc/uid/TP40010853-CH16-SW1

Layout Anchors

target 요소로 앵커를 건다
앵커방식은 코드를 간결하게 짤 수 있고 컴파일 에러를 잘 띄워주므로 자주 사용될 방식

예제로 확인하자

✅ 주의할 점

• constant의 양수/음수에 주의할 것
• greaterThan과 lessThan의 방향차이에 주의할 것

let button = UIButton() // 버튼설정은 생략
let target = view.safeAreaLayoutGuide // target view의 레이아웃 설정을 불러옴

let leadingAnchor = button.leadingAnchor.constraint(equalTo: target.leadingAnchor, constant: 10)
leadingAnchor.isActive = true

let trailingAnchor = button.trailingAnchor.constraint(equalTo: target.trailingAnchor, constant: -10)
trailingAnchor.isActive = true

let bottomAnchor = button.bottomAnchor.constraint(lessThanOrEqualTo: target.bottomAnchor, constant: -20)
bottomAnchor.isActive = true
bottomAnchor.priority = .init(999)
//bottomAnchor.priority = .defaultHigh도 가능 (750을 의미)

// Aspect Ratio도 가능. 
button.heightAnchor.constraint(equalTo: button.widthAnchor, multiplier: 2.0).isActive = true 

NSLayoutConstraint

constraint를 하나하나 다 만들어주는 방식

다만, 컴파일 에러를 안 띄워주므로 앵커방식에 비해 디버깅이 어렵다

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

참고로, .isActive= = true 대신 constraint들을 한 번에 활성화하는 방식도 있다

NSLayoutContraint.activate([leadingConst, trailingConst, widthConst])