SwiftUI 详细视图在 iOS 主/详细信息应用程序中未按预期显示答案

【问题标题】：SwiftUI Detail View not Displaying as Desired in iOS Master/Detail AppSwiftUI 详细视图在 iOS 主/详细信息应用程序中未按预期显示
【发布时间】：2020-08-16 02:28:58
【问题描述】：

我正在尝试创建一个在 iOS 和 iPadOS 上运行的 Master/Detail 应用程序。当我将应用程序旋转到横向时，它在 iPadOS 上按预期运行；然而，在 iOS 上，主视图会覆盖细节视图，而不是缩小细节以适应分屏。我可能在其中一个视图上缺少修饰符，但我找不到解决方案。任何帮助将不胜感激。

代码如下：

struct ContentView: View {
    var body: some View {
        VStack(alignment: .leading) {
            NavigationView {
                MasterView().navigationBarTitle("Star Wars Characters")
                DetailView()
            }.navigationViewStyle(DoubleColumnNavigationViewStyle())
        }
    }
}

struct MasterView: View {

    @ObservedObject var dataStore = DataStore()

    var body: some View {
        List {
            ForEach(sortedPeople) { person in
                NavigationLink(destination: DetailView(person: person)) {
                    PersonView(person: person)
                }
            }
        }
    }

    var sortedPeople: [Person] {
        return dataStore.people.sorted {$0.firstName < $1.firstName}
    }
}

struct PersonView: View {
    var person: Person
    var body: some View {
        VStack(alignment: .leading){
            Text("\(person.lastName)").font(.headline).fontWeight(.ultraLight)
            Text("\(person.firstName)").font(.subheadline).fontWeight(.light)
        }
        .padding(.leading)
    }
}

struct DetailView: View {

    var person = Person()

    var body: some View {
        VStack(alignment: .leading, spacing: 5) {
            Text(displayText()).font(.title)
        }.padding()
        .navigationBarTitle("????????")
    }

    func displayText() -> String {
        return person.firstName != "" ? "Hello \(person.name)" : "Click on someone to say hi"
    }
}

这是输出：

iPadOS

iOS

正如所指出的，我知道这是默认行为。但是，如果您查看 Apple 的 Contact 应用程序，您似乎可以实现 期望的 行为。

Apple's Contact app

【问题讨论】：

标签： swiftui master-detail navigationview

【解决方案1】：

这是默认行为。 iPhone 横向 == iPad 纵向。如果您点击 DetailView 的可见区域，MasterView 将使用类似于动画的抽屉进行动画处理。

【讨论】：