iOS 16环境下自定义NavigationBar使用.inline标题显示模式失效的解决方案咨询

看起来你在把项目降级到iOS16后，遇到了自定义导航栏在.inline标题模式下的一系列头疼问题——标题不显示、导航栏高度异常，切换到.large模式又没法让标题居中，静态状态和滚动状态的导航栏高度还不一致。我帮你梳理下问题根源，再给出针对性的修复方案：

问题根源分析 #

1. Appearance配置顺序逻辑错误：你在init里先设置了titleTextAttributes，之后才调用configureWithTransparentBackground()，这个方法会重置导航栏的默认属性，直接把你刚配置的文本样式覆盖了，导致inline模式的标题配置失效。
2. Inline模式标题属性缺失：你只仔细配置了largeTitleTextAttributes，但.inline模式对应的是titleTextAttributes，你只设置了颜色，没指定字体大小，iOS16下系统可能因为字体尺寸识别问题，导致标题不渲染或者导航栏高度计算异常。
3. 全局Appearance初始化时机问题：在ViewModifier的init里修改全局的UINavigationBar.appearance()，会导致所有导航栏强制共享这个配置，而且init只在Modifier创建时执行一次，后续页面的配置可能不会生效，还容易和系统导航栏的状态产生冲突。
4. 滚动/静态状态的Appearance不一致：你配置了scrollEdgeAppearance和standardAppearance，但两者的高度、背景配置没有完全对齐，导致静态时用standardAppearance、滚动到顶部用scrollEdgeAppearance时出现高度跳变。

具体修复方案 #

方案1：修正UINavigationBarAppearance的配置逻辑 #

调整配置顺序，确保重置类方法先执行，再补全inline模式的标题字体配置，同时把全局配置移到更合理的时机：

struct CustomNavigationBarView: ViewModifier {
    @Environment(\.dismiss) private var dismiss // 替换iOS16+废弃的presentationMode
    var showBackButton: Bool
    
    init(showBackButton: Bool = false) {
        self.showBackButton = showBackButton
    }
    
    func body(content: Content) -> some View {
        content
            .navigationBarBackButtonHidden(true)
            .toolbar {
                if showBackButton {
                    ToolbarItem(placement: .navigationBarLeading) {
                        Button(action: {
                            dismiss() // 用新的dismiss API处理页面返回
                        }) {
                            HStack {
                                Image(systemName: "chevron.left")
                                    .foregroundColor(.white)
                            }
                        }
                    }
                }
            }
            .onAppear {
                // 把Appearance配置移到onAppear，避免全局初始化的时机冲突
                let navBarAppearance = UINavigationBarAppearance()
                
                // 先执行透明背景重置，再覆盖自定义属性
                navBarAppearance.configureWithTransparentBackground()
                
                // 补全Inline模式的标题属性（对应standardAppearance）
                navBarAppearance.titleTextAttributes = [
                    .foregroundColor: UIColor.white,
                    .font: UIFont.systemFont(ofSize: 17, weight: .semibold)
                ]
                
                // 保持Large模式的标题配置
                navBarAppearance.largeTitleTextAttributes = [
                    .foregroundColor: UIColor.white,
                    .font: UIFont.systemFont(ofSize: 17, weight: .semibold)
                ]
                
                // 设置渐变背景（指定导航栏默认高度，让系统正确计算区域）
                navBarAppearance.backgroundImage = makeLinearGradient(
                    size: .init(width: UIScreen.main.bounds.width, height: 44),
                    colors: [UIColor(Color.nav1), UIColor(Color.nav2)]
                )
                navBarAppearance.shadowImage = UIImage()
                
                // 同步所有状态的Appearance，避免滚动时样式跳变
                UINavigationBar.appearance().standardAppearance = navBarAppearance
                UINavigationBar.appearance().compactAppearance = navBarAppearance
                UINavigationBar.appearance().scrollEdgeAppearance = navBarAppearance
                UINavigationBar.appearance().compactScrollEdgeAppearance = navBarAppearance
            }
    }
}

方案2：简化版本分支判断，统一使用inline模式 #

修复Appearance配置后，iOS16完全可以正常使用.inline模式，所以你可以简化之前的扩展代码，去掉不必要的版本判断：

extension View {
    func navigationBarModifier(showBackButton: Bool = false) -> some View {
        self
            .modifier(CustomNavigationBarView(showBackButton: showBackButton))
            .navigationBarTitleDisplayMode(.inline) // 所有支持的iOS版本统一用inline模式
    }
}

方案3：修复渐变背景图的尺寸问题 #

之前你生成渐变背景图的尺寸是(1,1)，iOS16下系统可能无法正确识别导航栏的有效区域，导致高度计算异常。把背景图高度设为inline模式导航栏的默认高度（44pt），让系统能正确识别背景范围：

func makeLinearGradient(size: CGSize, colors: [UIColor]) -> UIImage {
    let renderer = UIGraphicsImageRenderer(size: size)
    let colors: [CGColor] = colors.map({ $0.cgColor })
    guard let gradient = CGGradient(
        colorsSpace: CGColorSpaceCreateDeviceRGB(),
        colors: colors as CFArray,
        locations: [0, 1]
    ) else {
        return UIImage()
    }
    
    return renderer.image { context in
        context.cgContext.drawLinearGradient(
            gradient,
            start: CGPoint(x: 0, y: 0), // 调整渐变起点，从导航栏顶部开始
            end: CGPoint(x: size.width, y: size.height),
            options: []
        )
    }
}

额外注意事项 #

• 替换废弃API：iOS16+推荐用@Environment(\.dismiss)替代presentationMode处理页面返回，避免API废弃警告。
• 避免全局配置冲突：如果你的App有多种不同样式的导航栏，不要用UINavigationBar.appearance()做全局配置，建议在具体的NavigationStack中单独设置Appearance，或者用视图级别的修饰符。
• 同步所有状态的Appearance：确保standardAppearance、scrollEdgeAppearance、compactAppearance的配置完全一致，这样滚动时导航栏不会出现样式跳变。

你可以把这些修改应用到代码里，再在iOS16模拟器上测试，应该能解决标题不显示、高度异常和不居中的问题。

内容来源于stack exchange