You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

SwiftUI开启largeTitleDisplayMode后大标题字间距过小如何调整?

SwiftUI 导航栏大标题字间距调整方案

在不修改使用字体的前提下,有两种成熟方案可以调整大标题字间距,也可以关闭系统自动压缩效果:

方案1:全局统一配置(适配全应用场景)

通过UIKit的外观协议修改UINavigationBar的全局大标题属性,在App启动阶段执行一次即可全局生效:

// 可写在App结构体的init方法中,或是UIKit项目的didFinishLaunchingWithOptions代理里
UINavigationBar.appearance().largeTitleTextAttributes = [
    .kern: 1.2 // 按需调整数值,正数为加宽字间距,0为默认基础间距
]
  • 优点:无需逐个修改页面配置,侵入性极低,不影响原有字体的任何属性
  • 适用场景:全应用所有大标题需要统一调整字间距的情况

方案2:单页面自定义标题视图(适配精准控制场景)

如果只需要修改特定页面的大标题字间距,或是需要关闭自动压缩效果,可以隐藏系统自带的大标题,自行实现标题文本:

NavigationStack {
    // 你的页面主体内容
    List {
        Text("页面内容")
    }
    .navigationBarTitleDisplayMode(.inline) // 关闭系统自带大标题
    .toolbar {
        ToolbarItem(placement: .topBarLeading) {
            Text("页面大标题")
                .font(.largeTitle.bold())
                .tracking(1.2) // 自定义字间距
                .allowsTightening(false) // 完全关闭字间距自动压缩效果
                .padding(.top, 10)
        }
    }
}
  • 优点:可灵活控制单个页面的字间距、是否允许压缩、文本样式等所有属性,不影响其他页面
  • 适用场景:仅部分页面需要调整大标题样式的情况

注意事项

如果同时使用全局配置和自定义标题视图,自定义视图的属性优先级更高,会覆盖全局配置。


内容的提问来源于stack exchange,提问作者Danil Kolesnik

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.30 20:06:03