iPad端应用后台切前台后列表上移及工具栏异常问题

仅在iPad设备上出现该问题。应用启动后显示正常，但按下Home键重新打开时，会偶现以下bug（首次或多次操作后触发）：

• 侧边栏列表上移，顶部导航栏与列表间的间距消失；
• 详情视图toolbar的principal、leading、trailing项消失，仅bottom项保留。

相关代码 #

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()
    }
}

修复方案 #

1. 给侧边栏添加独立导航栈 #

在侧边栏的List外层包裹NavigationStack，明确导航层级，避免后台恢复时布局关联丢失：

NavigationSplitView {
    NavigationStack {
        List {
            // 原列表内容保持不变
        }
        .toolbar {
            // 原toolbar内容保持不变
        }
    }
} detail: {
    Text("Select an Item")
}

2. 给详情视图添加独立导航栈 #

在detailView的Text外层同样包裹NavigationStack，确保toolbar的各个项能被系统正确识别和渲染：

@ViewBuilder
func detailView(text: String) -> some View {
    NavigationStack {
        Text(text)
            .toolbar {
                // 原toolbar内容保持不变
            }
    }
}

3. 强制导航栏状态稳定 #

在侧边栏List和详情视图Text上添加导航栏显示配置，确保后台恢复时导航栏不会意外隐藏：

// 侧边栏List添加
List {
    // ...
}
.navigationBarTitleDisplayMode(.inline)
.navigationBarHidden(false)

// 详情视图Text添加
Text(text)
.navigationBarTitleDisplayMode(.inline)
.navigationBarHidden(false)
.toolbar {
    // ...
}

问题根源 #

这类偶现bug是iPad上NavigationSplitView在应用从后台恢复时，导航容器的状态未正确重建导致的。通过给侧边栏和详情视图分别添加独立的NavigationStack，可以明确导航结构，避免系统自动管理时的状态异常；强制导航栏可见则能保证布局计算的基准线始终稳定，不会出现列表上移或toolbar项消失的情况。

内容的提问来源于stack exchange，提问作者nirav dinmali