SwiftUI NavigationView

  • 이번에는 SwiftUI의 NavigationView에 대해 알아보겠다.
  • Swift 기본 문법을 숙지하고 있다는 가정 하에 작성되었다.
  • NavigationView는 다음과 같이 만들 수 있다.
NavigationView {
	// Views
}
  • Navigation 뷰와 Navigation 링크를 만들어보자.
  • Navigation 링크는 NavigationView의 다음 View로 넘어갈 수 있게 해주는 링크이다.
struct ContentViewFour: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: _) {
                Text("아녕")
            }
        }
    }
}

DetailView 만들기

  • 이제 Navigation 링크를 통해 이동할 Detail 뷰를 만들어보자.
struct ContentViewFive: View {
    var body: some View {
        VStack() {
            Text("우이")
        }
        .navigationBarTitle("아녕")
    }
}
  • 다음과 같이 Navigation 링크의 destination 파라미터에 Detail 뷰를 넣어준다.
  • 그러고나서 Navigation 링크를 터치해주면, Detail 뷰로 넘어간다.
struct ContentViewFour: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: ContentViewFive()) {
                Text("아녕")
            }
        }
    }
}
  • 앱을 사용할때 흔히 볼 수 있는 Navigation bar title도 다음과 같이 만들 수 있다.
struct ContentViewFour: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: ContentViewFive()) {
                Text("아녕")
            }.navigationBarTitle("움직여")
        }
    }
}

swiftui-tutorial-navigation

관련 글