SwiftUI 導航為 iPad，它是如何工作的？

Question

我正在學習 SwiftUI 並且有一個關於在 iPad 的視圖之間創建導航的問題。 我在網上看到了很多教程，但展示了小型移動設備，但沒有很多解決 iPad 導航理論和示例的內容。

--- 第 1 部分我有一個基本應用程序，我有一個“上一個”和“下一個”按鈕，需要導航到下一個或上一個頁面/視圖。 我嘗試使用 NavigationView/NavigationLink 路由，但似乎在 iPad 上效果不佳 - 根據我閱讀的一篇文章。

任何人都會有一些資源或者我可以研究的例子來了解它是如何應用的。

--- PART 2另外，我想創建一個抽屜式滑出菜單。 有沒有人有任何我可以查看的參考資源。

非常感謝大家。

示例代碼：當我運行模擬器並單擊 Next Page 時，沒有任何反應。 我有另一個視圖，其中結構稱為 page_2，但它沒有導航到它。

struct ContentView: View {
   var body: some View {
      NavigationView {
         ZStack {
            Image("iPad-bg")
                  .resizable(capInsets: EdgeInsets())
                  .ignoresSafeArea()
            VStack() {
                  HStack(alignment: .top) {
                     Spacer()
                     Button(action: {}) {
                        Image("menu-btn")
                              .resizable(capInsets: EdgeInsets())
                              .frame(width: 70.0, height: 70.0)
                              .padding(.trailing)
                     }
                     .padding(.top, -65)
                  }
                  Image("pg1-img1")
                     .padding(.top, -20.0)
                  HStack {
                     Button(action: {}) {
                        Text("Previous Page")
                           .foregroundColor(Color.white)
                     }
                     .padding(.vertical, 5.0)
                     .frame(width: 150.0)
                     .background(Color(red: 0.09, green: 0.10, blue: 0.21))
                     .cornerRadius(5.0)
                  Spacer()
                     NavigationLink(destination: page_2()){
                        Button(action: {}) {
                           Text("Next Page")
                              .foregroundColor(Color.white)
                        }
                        .padding(.vertical, 5.0)
                        .frame(width: 150.0)
                        .background(Color(red: 0.09, green: 0.10, blue: 0.21))
                        .cornerRadius(5.0)
                     }                     
                  }
                  .padding(.horizontal, 50.0)
                  Spacer()
            }
         }
      }
   }
}

Answer 1

您不能像這樣創建NavigationLink 。 如果你想要一個看起來像 Button 的NavigationLink ，你可以使用這樣的東西：

NavigationLink(destination: page_2()){
    Text("Next Page")
        .foregroundColor(Color.white)
}
.buttonStyle(.plain) // this is the important part
.padding(.vertical, 5.0)
.frame(width: 150.0)
.background(Color(red: 0.09, green: 0.10, blue: 0.21))
.cornerRadius(5.0)

作為提示：最好將此視圖分解為多個子視圖。 這不僅可以提高編碼時的性能，還可以讓您更好地推理您的代碼。