Snapkit 실무 코드

SnapKit 으로 실무 변환 코드를 써 놓으니 아마 도움 되실 분이 계실 것 같다.

Code 로 View 를 그리기 위한 필수 Pod 이다. SnapKit을 이용하면 코드량이 줄고 가독성이 좋아진다. pod 'SnapKit' 설치 후, import SnapKit 이면 코드 전환이 가능하다.

 

NSLayoutConstraint.activate([

            btnAddDefect.widthAnchor.constraint(equalToConstant: 64),

            btnAddDefect.heightAnchor.constraint(equalToConstant: 64),

            btnAddDefect.leadingAnchor.constraint(equalTo: self.mainView.leadingAnchor, constant: 8),

            btnAddDefect.bottomAnchor.constraint(equalTo: bottomView.topAnchor, constant: -8),

        ])

 

이 코드를 SnapKit을 이용하여, 간결하며 보다 나은 가독성의 코드로 바꿀 수 있다.

 

btnAddDefect.snp.makeConstraints {

            $0.width.equalTo(64)

            $0.height.equalTo(64)

            $0.left.equalTo(self.mainView.snp.left).offset(8)

            $0.bottom.equalTo(bottomView.snp.top).offset(-8)

        }

 

 

Tip : 다국어 적용이 아니면, leading 보다 left를, trailing보다 right를 쓰는 것이 좋다. leading/trailing 의 경우 오른쪽에서 왼쪽으로 쓰는 언어(히브리어, 아랍어) 인 경우 우측 정렬을 우선시 하게 해 준다.

 

그 외 변환 된 다양한 실무 코드를 보자.

 

NSLayoutConstraint.activate([            slider.widthAnchor.constraint(equalToConstant: 256),            hjhSlider.heightAnchor.constraint(equalToConstant: 30),            hjhSlider.leadingAnchor.constraint(equalTo: minusImage.trailingAnchor, constant: 12),            hjhSlider.trailingAnchor.constraint(equalTo: plusImage.leadingAnchor, constant: -12),            hjhSlider.centerYAnchor.constraint(equalTo: viewAngleLabel.centerYAnchor),         ])

hjhSlider.snp.makeConstraints {             $0.width.equalTo(256)             $0.height.equalTo(30)             $0.left.equalTo(minusImage.snp.left).offset(12)             $0.right.equalTo(plusImage.snp.right).offset(-12)             $0.centerY.equalTo(viewAngleLabel.snp.centerY)         }

NSLayoutConstraint.activate([             minusImage.widthAnchor.constraint(equalToConstant: 16),             minusImage.heightAnchor.constraint(equalToConstant: 2.7),             minusImage.leadingAnchor.constraint(equalTo: viewAngleLabel.trailingAnchor, constant: 4),             minusImage.centerYAnchor.constraint(equalTo: viewAngleLabel.centerYAnchor),         ])

minusImage.snp.makeConstraints {             $0.width.equalTo(16)             $0.height.equalTo(2.7)             $0.left.equalTo(viewAngleLabel.snp.right).offset(4)             $0.centerY.equalTo(viewAngleLabel.snp.centerY)         }

Tip : 레거시 코드 수동 변환 시에는 ^⌘T 로 옆에 탭을 하나 더 열고 작업하는 것이 좋다.

 

NSLayoutConstraint.activate([             plusImage.widthAnchor.constraint(equalToConstant: 16),             plusImage.heightAnchor.constraint(equalToConstant: 16),             plusImage.trailingAnchor.constraint(equalTo: self.view.trailingAnchor, constant: -12),             plusImage.centerYAnchor.constraint(equalTo: viewAngleLabel.centerYAnchor),         ])

plusImage.snp.makeConstraints {             $0.width.equalTo(16)             $0.height.equalTo(16)             $0.right.equalToSuperview().offset(-12)             $0.centerY.equalTo(viewAngleLabel.snp.centerY)         }

Tip : 상위 뷰가 self.view라면 .equalToSuperview를 쓸 수 있다.

NSLayoutConstraint.activate([             dropDown.heightAnchor.constraint(equalToConstant: 32),             dropDown.leadingAnchor.constraint(equalTo: self.mtkView.leadingAnchor, constant: 8),             dropDown.trailingAnchor.constraint(equalTo: self.mtkView.trailingAnchor, constant: -8),         ])

dropDown.snp.makeConstraints {             $0.height.equalTo(32)             $0.left.equalToSuperview().offset(8)             $0.right.equalToSuperview().offset(-8)         }

NSLayoutConstraint.activate([             viewAngleLabel.widthAnchor.constraint(equalToConstant: 30),             viewAngleLabel.heightAnchor.constraint(equalToConstant: 24),             viewAngleLabel.leadingAnchor.constraint(equalTo: self.mtkView.leadingAnchor, constant: 12),             viewAngleLabel.bottomAnchor.constraint(equalTo: self.mtkView.bottomAnchor, constant: -8),         ])

viewAngleLabel.snp.makeConstraints {             $0.width.equalTo(30)             $0.height.equalTo(24)             $0.left.equalToSuperview().offset(12)             $0.bottom.equalToSuperview().offset(-8)         }

NSLayoutConstraint.activate([             hjh_currentLocation.widthAnchor.constraint(equalTo: self.mtkView.widthAnchor, multiplier:0.4),             hjh_currentLocation.heightAnchor.constraint(equalToConstant: 32),             hjh_currentLocation.leadingAnchor.constraint(equalTo: self.mtkView.leadingAnchor),             hjh_currentLocation.topAnchor.constraint(equalTo: emptyView.bottomAnchor)         ])

hjh_currentLocation.snp.makeConstraints({ (ConstraintMaker) in             ConstraintMaker.width.equalTo(view.frame.width * 0.4)             ConstraintMaker.height.equalTo(32)             ConstraintMaker.left.equalToSuperview()             ConstraintMaker.top.equalTo(bottomView.snp.bottom)         })