Language/Swift

SwiftUI를 이용한 화면 이동하기(NavigationView)

IFLA 2022. 11. 14. 09:00

 

SwiftUI에서 다른 뷰로 이동을 하려면 NavigationView를 이용해 이동할 뷰를 보여주고, NavigationLink를 이용해 이동한 화면을 지정한다.

 

기본 코드

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                NavigationLink(destination: Text("상세보기")) {
                    Text("오늘도 좋은 하루")
                }
            }
            .navigationBarTitle("페이지 이동")
        }
    }
}
  • NavigationView 내에서 navigationBarTitle()를 사용할 수 있으며, 뷰 바깥쪽에서 사용을 안 해도 된다.

 

displayMode

  • .inline : 내비게이션 스택의 작은 제목을 표시한다
  • .automatic : 이전에 사용한 View를 사용한다.

 

실행 화면

 

navigationBarItems

  • leading / trailing이 있다. navigationBarTitle에 오른쪽과 왼쪽에 뷰를 이동할 버튼을 추가할 수 있다.
  •  
struct ContentView: View {
    var body: some View {
        NavigationIvew {
            Text("화면 상단 아이템 추가")
                .navigationBarTitle("메인 페이지", displayModE: .inline)
                .navigationBarItems(
                    leading: Button("왼쪽"){ print("왼쪽") }
                    trailing: Button("오른쪽") { print("오른쪽") } 
        }
    }
}

 

실행화면


개발자 Document

Apple Developer Documentation