SwiftUI问题：Split NavigationView内TabBar显示异常如何解决？

问题原因分析 #

1. 多余的EmptyView()干扰Tab布局：你在TabView最开头添加的EmptyView()会占据第一个Tab的位置，但没有对应的tabItem，导致后续的"Tab 1"实际是第二个Tab项。这种索引混乱会挤压TabBar的显示空间，甚至让第一个可见Tab被挤出视野。
2. TabView未适配侧边栏空间：Split NavigationView的侧边栏宽度有限，TabView如果没有明确填充可用空间，会出现布局偏移，导致标签被截断或隐藏。
3. iPad环境下TabView样式自适应问题：默认情况下，TabView在不同容器中可能切换样式，在侧边栏中容易出现布局异常。

解决方案 #

1. 移除多余的EmptyView()

删除TabView中的EmptyView()，让Tab项从"Tab 1"开始，确保索引和显示对应。

2. 调整TabView布局与样式

给TabView添加布局约束和显式样式，确保它适配侧边栏空间：

修改后的TabbedNavigationView代码：

struct TabbedNavigationView: View {
    var body: some View {
        TabView {
            Text("TAB 1")
                .tabItem {
                    Text("Tab 1")
                }
            
            Text("TAB 2")
                .tabItem {
                    Text("Tab 2")
                }
            
            Text("TAB 3")
                .tabItem {
                    Text("Tab 3")
                }

            Text("TAB 4")
                .tabItem {
                    Text("Tab 4")
                }
        }
        .tabViewStyle(DefaultTabViewStyle()) // 锁定默认TabBar样式，避免自适应异常
        .frame(maxWidth: .infinity, maxHeight: .infinity) // 让TabView占满侧边栏空间
    }
}

3. 显式指定NavigationView的双列布局（可选）

为了确保iPad上的Split布局稳定，可以给NavigationView指定双列样式：

修改后的SidebarContentView代码：

struct SidebarContentView: View {
    var body: some View {
        NavigationView {
            TabbedNavigationView()
            Text("DETAIL")
        }
        .navigationViewStyle(DoubleColumnNavigationViewStyle())
    }
}

额外优化：给TabItem添加图标（可选）

纯文本的TabItem在窄侧边栏中容易被截断，添加系统图标可以让标签更紧凑：

Text("TAB 1")
    .tabItem {
        Image(systemName: "1.circle")
        Text("Tab 1")
    }

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