Watch OS上Navigation title不显示问题排查（开发环境：Xcode）

我按照Apple官方SwiftUI教程开发，代码与教程完全一致，但在WatchOS预览中导航标题未显示，同一代码在iPhone模拟器中可正常运行。

问题代码 #

import SwiftUI

struct LandmarkDetail: View {
    @EnvironmentObject var modelData: ModelData
    var landmark: Landmark

    var landmarkIndex: Int {
        modelData.landmarks.firstIndex(where: { $0.id == landmark.id })!
    }

    var body: some View {
        ScrollView {
            VStack {
                CircleImage(image: landmark.image.resizable())
                    .scaledToFit()

                Text(landmark.name)
                    .font(.headline)
                    .lineLimit(0)

                Toggle(isOn: $modelData.landmarks[landmarkIndex].isFavorite) {
                    Text("Favorite")
                }

                Divider()

                Text(landmark.park)
                    .font(.caption)
                    .bold()
                    .lineLimit(0)

                Text(landmark.state)
                    .font(.caption)

                Divider()

                MapView(coordinates: landmark.locationCoordinates)
                    .scaledToFit()
            }
            .padding(16)
        }
        .navigationTitle("Landmarks")
    }
}

struct LandmarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        let modelData = ModelData()
        return Group {
            LandmarkDetail(landmark: modelData.landmarks[0])
                .environmentObject(modelData)
                .previewDevice("Apple Watch Series 5 - 44mm")
        }
    }
}

解决步骤 #

1. 给视图包裹导航容器

WatchOS的.navigationTitle必须在NavigationStack（watchOS 9+）或NavigationView（旧版本）内部才会生效，官方iOS教程默认依赖导航容器，但WatchOS预览和运行时需要显式添加：

修改预览代码：

struct LandmarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        let modelData = ModelData()
        return Group {
            // 针对watchOS 9+用NavigationStack，旧版本替换为NavigationView
            NavigationStack {
                LandmarkDetail(landmark: modelData.landmarks[0])
                    .environmentObject(modelData)
            }
            .previewDevice("Apple Watch Series 5 - 44mm")
        }
    }
}

同时，确保调用LandmarkDetail的父视图也包裹在对应的导航容器中，否则真机运行时标题依然不会显示。

2. 强制设置标题显示模式（可选）

WatchOS屏幕空间有限，可通过.navigationBarTitleDisplayMode强制标题以内联方式显示：

ScrollView {
    // ... 原有内容
}
.navigationTitle("Landmarks")
.navigationBarTitleDisplayMode(.inline) // 添加这一行

3. 检查版本兼容性

如果你的项目部署目标是watchOS 8或更早，需要使用NavigationView而非NavigationStack，并确保API调用与系统版本匹配。

原因说明 #

WatchOS的导航组件设计与iOS存在差异——iOS在部分场景下会自动生成导航栏，但WatchOS要求必须显式提供导航容器，.navigationTitle才能绑定到对应的导航栏上。官方教程侧重iOS场景，因此未明确提及WatchOS的这一差异。

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