[swift] SnapKit으로 네비게이션 바 커스터마이징하기

15 Nov 2023

swift

iOS 앱을 개발할 때, 네비게이션 바는 매우 중요한 요소입니다. 네비게이션 바를 커스터마이징하면 앱의 디자인을 개선하고 사용자 경험을 향상시킬 수 있습니다. 이번 블로그 포스트에서는 Swift와 SnapKit을 사용하여 네비게이션 바를 커스터마이징하는 방법에 대해 알아보겠습니다.

SnapKit이란?

SnapKit은 Auto Layout을 좀 더 쉽게 구현할 수 있도록 도와주는 오픈 소스 라이브러리입니다. SnapKit을 사용하면 코드로 Auto Layout을 작성하기 쉬워지고, UI 구성 요소들을 정확하게 배치할 수 있습니다.

SnapKit을 사용하여 네비게이션 바를 커스터마이징하는 방법은 다음과 같습니다.

1. SnapKit 설치하기

먼저 SnapKit을 프로젝트에 설치해야 합니다. SnapKit은 CocoaPods를 통해 설치할 수 있습니다. Podfile에 다음과 같이 SnapKit을 추가해 주세요.

pod 'SnapKit'

그리고 터미널에서 pod install 커맨드를 실행하여 SnapKit을 프로젝트에 추가해 주세요.

2. 뷰 컨트롤러에서 네비게이션 바 커스터마이징하기

네비게이션 바를 커스터마이징하기 위해코드를 작성해 보겠습니다.

import UIKit
import SnapKit

class CustomNavigationViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 네비게이션 바 커스터마이징
        let navigationBar = self.navigationController?.navigationBar
        navigationBar?.isTranslucent = false
        navigationBar?.barTintColor = .blue
        
        // 타이틀 레이블 생성
        let titleLabel = UILabel()
        titleLabel.text = "My App"
        titleLabel.textColor = .white
        titleLabel.font = UIFont.boldSystemFont(ofSize: 18)
        navigationBar?.addSubview(titleLabel)
        
        // 타이틀 레이블 Auto Layout 설정
        titleLabel.snp.makeConstraints {
            $0.centerX.equalToSuperview()
            $0.centerY.equalToSuperview().offset(10)
        }
    }
}

위 코드에서는 CustomNavigationViewController 클래스를 생성하고, viewDidLoad() 메소드에서 네비게이션 바를 커스터마이징하고 타이틀 레이블을 추가합니다.

네비게이션 바를 커스터마이징하는 방법은 다양하며, 위 코드에서는 배경색을 파랑색으로 지정하고, 타이틀 레이블을 추가하고, Auto Layout을 설정하는 방법을 보여줍니다.

SnapKit의 snp.makeConstraints 메소드를 사용하여 타이틀 레이블을 수평 중앙에, 수직 중앙보다 10만큼 아래에 위치하도록 설정하였습니다.

결론

SnapKit을 사용하여 네비게이션 바를 커스터마이징하는 방법에 대해 알아보았습니다. 네비게이션 바를 커스터마이징함으로써 앱의 디자인을 개선하고 사용자 경험을 높일 수 있습니다. SnapKit은 Auto Layout을 쉽게 다룰 수 있는 강력한 도구입니다. 추가적인 커스터마이징을 원한다면 SnapKit 문서를 참조해 주세요.

참고 자료:

SnapKit 공식 문서: https://github.com/SnapKit/SnapKit