SwiftUI：如何在导航栏叠加文本且不增加工具栏高度？

要实现导航栏中心显示用户名和状态文本、右侧显示头像，同时不改变工具栏默认高度，可以通过以下方式调整：

核心方案 #

利用ToolbarItem的.principal位置放置中心文本，配合fixedSize限制垂直高度，再结合.navigationBarTitleDisplayMode(.inline)确保导航栏紧凑：

struct YourView: View {
    var body: some View {
        NavigationStack {
            // 主内容区域（示例占位）
            Color.white
                .navigationBarTitleDisplayMode(.inline)
                .toolbar {
                    // 中心标题：用户名+状态
                    ToolbarItem(placement: .principal) {
                        VStack(spacing: 2) {
                            Text("你的用户名")
                                .font(.headline)
                            Text("最近上线")
                                .font(.caption)
                                .foregroundColor(.secondary)
                        }
                        .fixedSize(vertical: true) // 关键：垂直方向仅占用内容所需高度，不撑开工具栏
                    }
                    
                    // 右侧头像
                    ToolbarItem(placement: .navigationBarTrailing) {
                        Image(systemName: "person.circle.fill")
                            .resizable()
                            .frame(width: 32, height: 32)
                    }
                }
        }
    }
}

关键细节说明 #

1. .navigationBarTitleDisplayMode(.inline)：强制导航栏使用紧凑的行内模式，避免因标题内容自动拉伸高度。
2. .fixedSize(vertical: true)：让中心的VStack仅适配自身内容的垂直高度，不会向父视图（工具栏）申请额外空间，彻底解决工具栏被拉长的问题。
3. 右侧头像位置：使用.navigationBarTrailing的ToolbarItem，天然对齐导航栏右侧，不会干扰中心文本布局。

如果需要更精准的垂直居中控制，可以给中心VStack添加.frame(maxHeight: .infinity, alignment: .center)，确保文本在工具栏高度内垂直居中，效果一致。

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