iPad - 列表视图 - 背景到前景 - 向上移动

Question

仅发生在 iPad 设备中。

运行应用程序，看起来不错。按主页按钮，选择应用程序，会发生下面提到的错误（有时是第一次，有时是第二次、第三次、第四次）

1. 侧边栏中的列表向上移动（顶部导航栏和列表之间的空间丢失）
2. 详细视图工具栏的项目消失（主体、前导、尾随消失、底部保持）

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationSplitView {
            // Leading side (typically a list or navigation links)
            List {
                NavigationLink("Item 1", destination: detailView(text: "Detail View for Item 1"))
                NavigationLink("Item 2", destination: detailView(text: "Detail View for Item 2"))
                NavigationLink("Item 3", destination: detailView(text: "Detail View for Item 3"))
                NavigationLink("Item 4", destination: detailView(text: "Detail View for Item 4"))
                NavigationLink("Item 5", destination: detailView(text: "Detail View for Item 5"))
                NavigationLink("Item 6", destination: detailView(text: "Detail View for Item 6"))
                NavigationLink("Item 7", destination: detailView(text: "Detail View for Item 7"))
                NavigationLink("Item 8", destination: detailView(text: "Detail View for Item 8"))
                NavigationLink("Item 9", destination: detailView(text: "Detail View for Item 9"))
                NavigationLink("Item 10", destination: detailView(text: "Detail View for Item 10"))
                NavigationLink("Item 11", destination: detailView(text: "Detail View for Item 11"))
                NavigationLink("Item 12", destination: detailView(text: "Detail View for Item 12"))
                NavigationLink("Item 13", destination: detailView(text: "Detail View for Item 13"))
                NavigationLink("Item 14", destination: detailView(text: "Detail View for Item 14"))
                NavigationLink("Item 15", destination: detailView(text: "Detail View for Item 15"))
                NavigationLink("Item 16", destination: detailView(text: "Detail View for Item 16"))
                NavigationLink("Item 17", destination: detailView(text: "Detail View for Item 17"))
                NavigationLink("Item 18", destination: detailView(text: "Detail View for Item 18"))
            }
            .toolbar {
                ToolbarItem(placement: .principal) {
                    Text("Items")
                }
                ToolbarItem(placement: .navigationBarLeading) {
                         Button(action: {
                            let _ = print("going back to main screen")
                        })
                        {
                            Image(systemName: "chevron.left")
                        }
                    }
                }
        } detail: {
            // Default detail view when nothing is selected
            Text("Select an Item")
        }
    }
    
    // Function to generate a detail view with a principal toolbar item
    @ViewBuilder
    func detailView(text: String) -> some View {
        Text(text)
            .toolbar {
                ToolbarItem(placement: .principal) {
                    Text(text)
                }
                ToolbarItem(placement: .navigationBarTrailing) {
                    Text("Trailing")
                }
                ToolbarItem(placement: .bottomBar) {
                    Text("Bottom")
                }
            }
    }
}

// Preview
struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

Answer 1

侧边栏标题仅向上滚动，可以再次向下滚动。但在详细视图中顶部工具栏的消失对我来说似乎是一个错误。

• 滚动标题的解决方法是使用

  List

  的部分标题，而不是使用导航标题：

List {
    Section {
        // list items
    } header: {
        Text("Title") // or "" to show just a gap
            .font(.largeTitle)
            .fontWeight(.bold)
    }
}
.navigationBarTitleDisplayMode(.inline)
.navigationTitle("")

• 顶部工具栏消失的解决方法是使工具栏依赖于

  scenePhase

  :

@Environment (\.scenePhase) private var scenePhase

Text(text)
    .toolbar {
        if scenePhase == .active {
            // toolbar items as before
        }
    }

将它们放在一起（并使用

ForEach

表示列表项）：

struct ContentView: View {
    @Environment (\.scenePhase) private var scenePhase
    
    var body: some View {
        NavigationSplitView {

            // Leading side (typically a list or navigation links)
            List {
                Section {
                    ForEach(1...18, id: \.self) { n in
                        NavigationLink("Item \(n)", destination: detailView(text: "Detail View for Item \(n)"))
                    }
                } header: {
                    Text("Title") // or "" to show just a gap
                        .font(.largeTitle)
                        .fontWeight(.bold)
                }
            }
            .navigationBarTitleDisplayMode(.inline)
            .navigationTitle("")
            .toolbar {
                ToolbarItem(placement: .principal) {
                    Text("Items")
                }
                ToolbarItem(placement: .navigationBarLeading) {
                    Button {
                        let _ = print("going back to main screen")
                    } label: {
                        Image(systemName: "chevron.left")
                    }
                }
            }
        } detail: {

            // Default detail view when nothing is selected
            Text("Select an Item")
        }
    }
    
    // Function to generate a detail view with a principal toolbar item
    @ViewBuilder
    func detailView(text: String) -> some View {
        Text(text)
            .toolbar {
                if scenePhase == .active {
                    ToolbarItem(placement: .principal) {
                        Text(text)
                    }
                    ToolbarItem(placement: .navigationBarTrailing) {
                        Text("Trailing")
                    }
                    ToolbarItem(placement: .bottomBar) {
                        Text("Bottom")
                    }
                }
            }
    }
}