[iOS] UINavigationController란?

doooly·2023년 6월 30일

iOS

목록 보기

3/8

UINavigationController란?

https://developer.apple.com/documentation/uikit/uinavigationcontroller

UINavigationController는 계층적 콘텐츠 탐색을 위한 Stack 기반의 Container view controller 입니다.

한 개 이상의 child ViewController를 관리합니다.
Stack 기반이기 때문에 한 번에 최상단에 있는 하나의 ViewController만 볼 수 있습니다.
push, pop을 통해 표시될 ViewController를 결정할 수 있습니다.

UINavagationController의 구성요소

구성요소는 다음과 같이 4가지로 분류할 수 있습니다.

1. ViewControllers

NavigationController은 한 개 이상의 ViewController들을 Navigation stack을 이용해 관리합니다.
push, pop을 통해 해당 배열(stack)을 관리할 수 있습니다.

2. navigationBar

앱 상단에 생성되는 UI요소로, push를 이용해 이끌어낸 ViewController라면 자동으로 생성됩니다.
뒤로가기, 타이틀, 설정 등의 요소가 있으며 추가로 버튼을 생성할 수도 있습니다.
NavigationBar UI를 재정의를 통해 Custom할 수도 있습니다.

인터페이스 하단에 나타나는 영역으로, 각종 도구들이 위치해있습니다. 기본적으로 숨김처리되어있습니다.

isToolbarHidden 은 true가 기본값이므로, false를 통해 숨김 처리를 해제하고 해당 UI를 사용할 수 있습니다.

4. delegate

특정 Event에서 사용하기 위한 delegate가 이미 처리되어있으며, UINavigationControllerDelegate protocol을 준수합니다.
push, pop을 할 때 보통 사용되곤 합니다.

pushViewController(ViewController, animated: true)

popViewController(animated: true)

UINavigationController 선언

navigationController는 앱을 실행하는 순간부터 사용되기 때문에 SceneDelegate에 선언합니다.

또한 기본이 될 rootViewController를 설정한다는 특징이 있습니다.

1. SceneDelegate

   func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
       
        guard let windowScene = (scene as? UIWindowScene) else { return }
        window = UIWindow(windowScene: windowScene)
        let mainViewController = ViewController()
        
        let navigationController = UINavigationController(rootViewController: mainViewController)
        //rootViewController 설정

        window?.rootViewController = navigationController
        //window의 rootViewController을 navigationController로 설정
        window?.makeKeyAndVisible()
    }

NavigationController 객체를 생성하고, rootViewController을 mainViewController로 설정합니다.
window의 rootViewController을 navigationController로 설정합니다.

2. ViewController (firstView)



import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .lightGray
        setButton()
        //함수 이용해 버튼 설정
        
    }
    
    func setButton(){
        let Button : UIButton = {
           let btn = UIButton()
            btn.setTitle("First View", for: .normal)
            btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 30)
            btn.backgroundColor = .systemRed
            btn.tintColor = .white
            btn.layer.cornerRadius = 20
            return btn
        }()
        
        view.addSubview(Button)
        //view에 Button을 추가함
        
        
        Button.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            Button.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 200),
            Button.centerXAnchor.constraint(equalTo: view.safeAreaLayoutGuide.centerXAnchor),
            Button.widthAnchor.constraint(equalToConstant: 200),
            Button.heightAnchor.constraint(equalToConstant: 100)])
        
        
        Button.addTarget(self, action: #selector(firstBtn(_:)), for: .touchUpInside)
        //action 정의, #selector에 들어갈 함수 정의
        
    }
    
    @objc func firstBtn(_:UIButton){
        let SecondVC = SecondViewController()
        navigationController?.pushViewController(SecondVC, animated: true)
        //SecondVC 인스턴스정의 후 push - true
    }

}

viewDidLoad()에서 배경 색을 정해주고, setButton() 함수를 만들어 버튼을 정의했습니다.
Button의 글씨크기, title, 배경색과 글자색을 지정해주고, 버튼의 둥글기까지 custom했습니다.
addSubview를 통해 Button을 View에 넣고, NSLayoutConstraint를 이용해 간격을 지정했습니다.
Button에 addTarget 함수를 이용해 누르면 다음 화면으로 넘어가도록 했습니다. firstBtn 함수를 @objc 이용해 선언했으며, pushViewController()을 통해 SecondViewController을 push 합니다.

3. SecondViewController (secondView)


import UIKit
class SecondViewController : UIViewController{
    override func viewDidLoad() {
        view.backgroundColor = .systemMint
        setButton()
    }
    
    func setButton(){
        let Button : UIButton = {
           let btn = UIButton()
            btn.setTitle("Second View", for: .normal)
            btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 30)
            btn.backgroundColor = .systemRed
            btn.tintColor = .white
            btn.layer.cornerRadius = 20
            return btn
        }()
       
        
        view.addSubview(Button)
        //view에 Button을 추가함
        
        
        Button.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            Button.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 200),
            Button.centerXAnchor.constraint(equalTo: view.safeAreaLayoutGuide.centerXAnchor),
            Button.widthAnchor.constraint(equalToConstant: 200),
            Button.heightAnchor.constraint(equalToConstant: 100)
        ])
        
        Button.addTarget(self, action: #selector(BackBtn(_:)), for: .touchUpInside)
        //Button을 누르면 BackBtn함수 실행 -> pop
        
    }
    
    @objc func BackBtn(_: UIButton){
        navigationController?.popViewController(animated: true)
        //pop 기능
    }
    
}