Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- tableView
- HIG
- SWIFT
- uiscrollview
- 스위프트
- 리펙터링
- map
- 애니메이션
- Refactoring
- clean architecture
- collectionview
- UICollectionView
- ribs
- RxCocoa
- rxswift
- MVVM
- 리팩토링
- Protocol
- uitableview
- UITextView
- Human interface guide
- Clean Code
- ios
- combine
- 리펙토링
- Observable
- Xcode
- swift documentation
- swiftUI
- 클린 코드
Archives
- Today
- Total
김종권의 iOS 앱 개발 알아가기
[iOS - swift] SnapKit (스냅킷, 오토레이아웃) 필수로 알아야 하는 것 본문
SnapKit을 사용할때 해석 방향이 가장 중요
- 순차적으로 해석: 만들다 > 상단을 > viewProgreess의 하단과 동일 > offset은 32
make.top.equalTo(viewProgress.snp.bottom).offset(32)
Anchor
- 모든 앵커와 제약 조건 자체를 함께 연결하는것이 가능
child.snp.makeConstraints { make in
make.lead.top.trailing.bottom.equalToSuperview()
}
- edge를 이용하여 더욱 간편하게 사용
child.snp.makeConstraints { make in
make.edges.equalToSuperview()
}
- view에 inset값을 주고 싶은경우 inset()사용
child.snp.makeConstraints { make in
make.edges.equalToSuperview().inset(16)
}
Constraint
- multipliedBy()
// superview의 너비와 같게 만들고 0.45를 곱한 형태
make.width.equalToSuperview().multipliedBy(0.45)
- offset()
// 상단을 viewProgress의 하단으로 제한하고, 32만큼 offset
make.top.equalTo(viewProgress.snp.bottom).offset(32)
- offset() vs inset()
- offset: element와의 간격에 사용
- inset: superview와의 간격에 사용
offset으로 표현
myView.snp.makeConstraints { make in
make.top.equalToSuperview().offset(50)
make.left.equalToSuperview().offset(50)
make.right.equalToSuperview().offset(-50)
make.bottom.equalToSuperview().offset(-50)
}
inset으로 표현
myView.snp.makeConstraints { make in
make.edges.equalToSuperview().inset(UIEdgeInsets(top: 50, left: 50, bottom: 50, right: 50))
}
// 동일 코드: make.edges.equalToSuperview().inset(50)
암시
- constraint기준이 되는 View의 width, point를 지정해주지 않아도 암시적으로 동일하도록 설정
- constraint기준이 되는 View의 값을 최대한 짧게 작성 편의
// 원본
view.snp.makeConstraints { make in
make.width.equalTo(otherView.snp.width)
make.centerX.equalTo(otherView.snp.centerX)
}
// 동일1
view.snp.makeConstraints { make in
make.width.equalTo(otherView)
make.centerX.equalTo(otherView)
}
// 동일2
view.snp.makeConstraints { make in
make.width.centerX.equalTo(otherView)
}
updateConstraint
- constraint 기준이 될 기존에 지정한 view가 바뀌는게 아닌 constant value만 업데이트 하고 싶은 경우
extension QuizViewController {
override func willTransition(
to newCollection: UITraitCollection,
with coordinator: UIViewControllerTransitionCoordinator
) {
super.willTransition(to: newCollection, with: coordinator)
// 현재 방향
let isPortrait = UIDevice.current.orientation.isPortrait
// 방향에 따른 label 높이 값 조정
lblTimer.snp.updateConstraints { make in
make.height.equalTo(isPortrait ? 45 : 65)
}
// 방향에 따른 font 크기 값 조정
lblTimer.font = UIFont.systemFont(ofSize: isPortrait ? 20 : 32, weight: .light)
}
}
remakeConstraint
- constant value만 변경되는게 아닌 기준이 될 view도 바뀌는 경우
- 기존에 존재하던 constraints 삭제
func updateProgress(to progress: Double) {
viewProgress.snp.remakeConstraints { make in
make.top.equalTo(view.safeAreaLayoutGuide)
make.width.equalToSuperview().multipliedBy(progress)
make.height.equalTo(32)
make.leading.equalToSuperview()
}
}
lessThanOrEqualTo, priority
- lessThanOrEqualTo() 추가하여 사용
- priority() 추가하여 사용
override func updateConstraints() {
self.growingButton.snp.updateConstraints { (make) -> Void in
make.center.equalTo(self);
make.width.height.equalTo(buttonSize).priority(250)
make.width.height.lessThanOrEqualTo(self)
}
super.updateConstraints()
}
* 참고
https://www.programmersought.com/article/77934550381/
https://www.raywenderlich.com/3225401-snapkit-for-ios-constraints-in-a-snap
'iOS 응용 (swift)' 카테고리의 다른 글
[iOS - swift] PageViewController (페이지 뷰 컨트롤러) (7) | 2021.07.15 |
---|---|
[iOS - swift] @available(*, unavailable) 사용하여 비가용성 정의 (0) | 2021.07.13 |
[iOS - swift] 코드로 xib파일을 얻는 Protocol 정의 (StoryboardInstantiable) (0) | 2021.07.11 |
[iOS - swift] DispatchQueue.main.sync 사용 시 주의사항 (Deadlock) (2) | 2021.07.05 |
[iOS - swift] 코드에서 이미지, 색상 확인 방법 Literal (#ImageLiteral, colorLiteral) (0) | 2021.07.05 |
Comments