SwiftUI导航栏设置：轻松打造清晰的页面结构

开发iOS应用时，页面之间的跳转和层级关系处理很关键。SwiftUI提供了简洁的方式管理导航，其中导航栏是最常见的交互元素之一。比如你正在做一个购物App，从商品列表点进详情页，顶部的返回按钮和标题就是靠导航栏实现的。

使用NavigationView构建基础导航

在SwiftUI中，NavigationView是导航体系的核心容器。虽然在iOS 16及以上版本中，系统会自动提供导航栈，但显式使用仍有助于理解结构。下面是一个简单的例子：

var body: some View {
    NavigationView {
        List {
            ForEach(products) { product in
                NavigationLink(product.name) {
                    ProductDetailView(product: product)
                }
            }
        }
        .navigationTitle("商品列表")
    }
}

这里的.navigationTitle("商品列表")会显示在导航栏顶部，用户一眼就知道当前所在位置。

自定义导航栏外观

有时候默认样式不够用。比如你的App走极简风格，想隐藏导航栏下划线，或者修改标题字体。通过UINavigationBar.appearance()可以全局调整，但在SwiftUI中更推荐使用视图修饰符局部控制。

例如，去掉分割线并设置背景色：

let appearance = UINavigationBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = UIColor.systemBlue
UINavigationBar.appearance().standardAppearance = appearance
UINavigationBar.appearance().scrollEdgeAppearance = appearance

这段代码通常放在App启动时执行，比如init()里或SceneDelegate中。

动态标题与右上角按钮

进入详情页后，可能需要根据内容动态更新标题，甚至添加分享或编辑按钮。SwiftUI支持在视图内部直接配置：

struct DetailView: View {
    let item: Item

    var body: some View {
        Text(item.content)
            .navigationTitle(item.title)
            .navigationBarTitleDisplayMode(.large)
            .toolbar {
                ToolbarItem(position: .navigationBarTrailing) {
                    Button("分享") {
                        // 分享逻辑
                    }
                }
            }
    }
}

这里.navigationBarTitleDisplayMode(.large)控制标题是否展开为大标题模式，常见于邮件或笔记类App。

处理深色模式下的显示问题

有些开发者发现导航栏在深色模式下颜色异常，文字看不清。这通常是因为背景色没有适配。可以使用Color而不是UIColor来声明颜色，让系统自动响应环境变化。

例如将背景设为Color.primary或Color.background，这样切换系统主题时界面依然协调。