macOS视图只显示在左侧边栏的问题

问题描述

在适配SwiftUI应用时，为了适配更多的机型，初代应用的版本适配15.0。但是在适配的过程中发现，运行macOS时，应用的视图只显示在左侧边栏。

经过查询发现问题与NavigationView在 macOS 上的默认行为有关。在 macOS 上，NavigationView 默认使用 NavigationSplitView，这就会导致左侧出现 Sidebar，而应用只想显示一个视图，可以使用.navigationViewStyle(.stack)（iOS & macOS 兼容）。

解决方案

1、使用 .navigationViewStyle(.stack)（iOS & macOS 兼容）

struct Home: View {
    @Binding var viewStep: Int
    var body: some View {
        NavigationView {
            VStack {
                Text("Home View")
                Button("进入游戏") {
                    viewStep = 1
                }
            }
        }
        .navigationViewStyle(.stack) // 让 macOS 也变成单个视图
    }
}

在 macOS 上，NavigationView 默认是 NavigationSplitView，会自动添加 Sidebar。

.navigationViewStyle(.stack) 让 NavigationView 变成 iOS 风格，不再自动添加 Sidebar。

2、直接用 NavigationStack

如果macOS 版本是 macOS 13+，可以直接用 NavigationStack：

struct Home: View {
    @Binding var viewStep: Int
    var body: some View {
        NavigationStack {
            VStack {
                Text("Home View")
                Button("进入游戏") {
                    viewStep = 1
                }
            }
        }
    }
}

NavigationStack 是 iOS 16 / macOS 13 之后推荐的导航方式。

直接解决 macOS 上的 Sidebar 问题，无需额外 .navigationViewStyle(.stack)。

3、完全去掉 NavigationView

如果不需要导航功能，直接删除 NavigationView：

struct Home: View {
    @Binding var viewStep: Int
    var body: some View {
        VStack {
            Text("Home View")
            Button("进入游戏") {
                viewStep = 1
            }
        }
    }
}

总结

推荐方案 1（兼容 iOS & macOS）：NavigationView { … }.navigationViewStyle(.stack)

推荐方案 2（macOS 13+）：改用 NavigationStack

推荐方案 3（如果不需要导航）：完全去掉 NavigationView