Day9 NavigationView

NavigationView可以製作跳轉到下一頁，而跳轉到下一頁使用NavigationLink來產生跳轉，例如：

struct SwiftUIView9: View {
    var body: some View {
        NavigationView {
            NavigationLink(
                destination: SwiftUIView9_Next(),
                label: {
                    Text("Go To Page2")
                })
        }
    }
}

struct SwiftUIView9_Next: View {
    var body: some View {
        VStack {
            Text("Next Page")
        }
    }
}

NavigationLink指定跳轉的目標，也就是直接在destination帶入目標View，而這個目標View就是子SwiftUIView9_Next。

顯示如圖：

按下跳轉Link之後，就可以跳轉到第二頁，而這個第二頁就是SwiftUIView9_Next

顯示如圖：

可以在NavigationView上面加入Title，例如：

NavigationView {
    NavigationLink(
        destination: SwiftUIViewB7_Next(),
        label: {
            Text("Go To Page2")
        })
    .navigationTitle("Header")
}

顯示如圖：

也可以加入ScrollView，例如：

NavigationView {
    ScrollView {
        NavigationLink(
            destination: SwiftUIViewB7_Next(),
            label: {
                Text("Go To Page2")
            })
    }
}

顯示如圖：

有的時候也會需要這種跳轉頁面的動畫效果，但是不想要使用原生的Header，則可以將之隱藏起來，例如：

NavigationView {
    ScrollView {
        NavigationLink(
            destination: SwiftUIViewB7_Next(),
            label: {
                Text("Go To Page2")
            })
    }
    .navigationBarBackButtonHidden()
}

navigationBarBackButtonHidden屬性，可以將header隱藏起來，隱藏起來之後，就不會顯上back的按鈕。

而如果已經跳轉到第二頁，也可將back鍵隱藏起來，例如：

var body: some View {
    VStack {
        Text("Next Page")
    }
    .navigationBarBackButtonHidden()
}

從 SwiftUI 到 Apple Vision Pro - SwiftUI 從零開始 Day9 [完]