當我在ipad模擬器上打開應用程式時，設計已損壞

當我在 iPad 上運行應用程式時，設計沒有出現在螢屏上。當您單擊左上角導航欄中的主頁時，會出現設計，但它已加載一半。當我洗掉 NavigationView 時，會出現正常設計但不可點擊。

struct MainView: View {
    @EnvironmentObject var store: BlogPostsStore
    @Environment(\.colorScheme) var colorScheme
    
    var featuredPosts: [BlogPost] {
        return store.blogPosts.filter {$0.featured == true}
    }
    
    var body: some View {
        
        NavigationView {
            ScrollView {
                // featured article
                if featuredPosts.count > 0 {
                    VStack {
                        HStack {
                            Text("Featured posts")
                                .font(.title.bold())
                            Spacer()
                        }
                        LazyVStack {
                            ForEach(featuredPosts) {post in
                                NavigationLink(destination: BlogPostView(blogPost: post)) {
                                    BlogPostCardMain(blogPost: post)
                                }
                            }
                        }
                    }
                    .padding(.horizontal, 15)
                    .padding(.vertical, 30)
                }
// latest articles
                VStack {
                    HStack {
                        Text("Latest posts")
                            .font(.title.bold())
                        Spacer()
                    }
                    .padding(.horizontal, 15)
                    
                    ScrollView(.horizontal, showsIndicators: false) {
                        LazyHStack(spacing: 15) {
                            if store.blogPosts.count >= 3 {
                                ForEach(store.blogPosts[0...2]) {post in
                                    NavigationLink(destination: BlogPostView(blogPost: post)) {
                                        BlogPostCardMain(blogPost: post)
                                    }
                                }
                                
                            } else {
                                ForEach(store.blogPosts[0..<store.blogPosts.count]) {post in
                                    NavigationLink(destination: BlogPostView(blogPost: post)) {
                                        BlogPostCardMain(blogPost: post)
                                    }
                                }
                            }
                        }
                        .padding(.leading, 15)
                        .padding(.trailing, 30)
                    }
                    .frame(height: 420)
                    
                    Spacer()
                }
                .padding(.bottom, 40)
                
            }
            .navigationBarTitle("Home")
            .navigationBarItems(
                trailing: Button(action: {store.refreshView()}) { Image(systemName: "arrow.clockwise.circle.fill")
                    .resizable()
                    .frame(width: 30, height: 30)
            })
        }
    }
}

在此處輸入影像描述

在此處輸入影像描述

uj5u.com熱心網友回復：

這NavigationView取決于 iPad（以及橫向更大的 iPhone）上的作業方式。

給 NavigationView 的第一個視圖充當可折疊的左側導航，它是固定寬度。該視圖中的任何NavigationLink目的地都將在占據全屏的主“詳細”視圖中打開。

您可以在第一個視圖下方指定第二個視圖，以提供“默認”視圖以顯示在主螢屏中：

NavigationView {
  // the sidebar view
  ScrollView {
    // etc.
  }
  // the default view
  Text("Default view")
}

您還可以添加第三個視圖，如果您愿意，它將自動為您的 iPad 提供類似于 Mail 等使用的三列視圖。

.navigationViewStyle另一種選擇是通過添加一個引數來強制 NavigationView 的作業方式與 iPhone 在縱向模式下的作業方式完全相同：

NavigationView {
  // contents as before
}
.navigationViewStyle(.stack)

雖然這會給你在 iPad 上類似 iPhone 的體驗，但如果沒有仔細的設計作業，它并不能真正充分利用更大的螢屏空間。出于這個原因，通常最好花一些時間來設計一個適合默認 iPad 導航視圖樣式的應用程式設計。

標籤：迅速 代码 迅捷 swiftui-导航链接

上一篇：嘗試在iPhone上除錯以前可以運行的應用程式時出錯

下一篇：在SwiftUI中將貨幣運算式包裝在常量中