SwiftUI中如何自定义TabBar标签的字体？

我太懂这种挫败感了——明明OpenSans字体在其他视图里都好好的，偏偏TabBar的标签就是不买账！你试的几种方法其实方向都对，但可能因为SwiftUI TabView底层依赖UIKit的特性，或者系统的样式优先级覆盖了你的设置，导致没生效。咱们一步步来解决：

一、先确认UIKit外观代理的正确打开方式（通用iOS版本） #

你尝试用UITabBarItem.appearance()设置字体是完全正确的思路，但要注意设置时机和细节匹配：

1. 确保调用这段代码的时机足够早——比如在你的App结构体初始化方法里，或者UIKit生命周期项目的SceneDelegate的willConnectTo方法里：

@main
struct YourApp: App {
    init() {
        // 确认SwiftGen生成的字体是UIFont类型（一般都会自动处理）
        let tabFont = FontFamily.OpenSans.extraBold.font(size: 18)
        // 给正常和选中状态都设置字体
        UITabBarItem.appearance().setTitleTextAttributes([.font: tabFont], for: .normal)
        UITabBarItem.appearance().setTitleTextAttributes([.font: tabFont], for: .selected)
    }
    
    var body: some Scene {
        WindowGroup {
            TabView {
                // 你的Tab内容
            }
        }
    }
}

2. 为什么之前直接给TabItem里的Text加font modifier没用？因为SwiftUI的TabBar内部会对标签文本应用系统默认的字体样式，优先级比你手动加的modifier高，所以会直接被覆盖掉。

二、iOS 18+的额外注意事项 #

iOS 18推出的新Tab视图API，底层依然依赖UITabBar，所以上面的外观代理方法依然有效。如果想尝试纯SwiftUI的方式，可以试试给整个Label/VStack加字体modifier，而不是只给Text单独加：

Tab(
    content: { Text("My tab content here...") },
    label: {
        Label(
            title: { Text(SFAssetVerificationUI.L10n.audits) },
            icon: { SFAssetVerificationUI.Asset.icTabAudits.swiftUIImage }
        )
        .font(FontFamily.OpenSans.extraBold.swiftUIFont(fixedSize: 18))
    }
)

不过亲测还是UIKit外观代理的方法更可靠，毕竟系统对TabBar的样式管控确实很严格。

三、极端情况：完全自定义TabBar（如果上面的方法都不行） #

如果系统TabBar实在太顽固，你可以自己实现一个自定义TabBar组件，用HStack封装按钮、控制选中状态，这样就能完全掌控字体样式了：

struct CustomTabBar: View {
    @Binding var selectedTab: Int
    
    var body: some View {
        HStack {
            Spacer()
            Button(action: { selectedTab = 0 }) {
                VStack {
                    SFAssetVerificationUI.Asset.icTabAudits.swiftUIImage
                        .foregroundColor(selectedTab == 0 ? .blue : .gray)
                    Text(SFAssetVerificationUI.L10n.audits)
                        .font(FontFamily.OpenSans.extraBold.swiftUIFont(fixedSize: 18))
                        .foregroundColor(selectedTab == 0 ? .blue : .gray)
                }
            }
            Spacer()
            // 其他Tab按钮
        }
        .padding(.vertical, 8)
        .background(Color.white)
    }
}

然后在主视图里用ZStack把内容和自定义TabBar组合起来：

struct MainView: View {
    @State private var selectedTab = 0
    
    var body: some View {
        ZStack(alignment: .bottom) {
            switch selectedTab {
            case 0: Text("Audits Tab")
            // 其他Tab内容
            default: Text("Other Tab")
            }
            
            CustomTabBar(selectedTab: $selectedTab)
        }
    }
}

这种方法虽然麻烦，但完全不受系统样式限制，想怎么改就怎么改。

备注：内容来源于stack exchange，提问作者Jacob King