iOS17+：.toolbarTitleDisplayMode(.inlineLarge)滚动时工具栏按钮未隐藏

要实现类似iOS健康和App Store的个人资料按钮效果——滚动时大标题切换为inline模式，按钮随之隐藏，你需要将按钮绑定到导航标题的trailing区域，而非独立的工具栏项。之前的错误在于把.toolbarTitleDisplayMode(.inlineLarge)应用到了单个Image上，且按钮放在了topBarTrailing位置，导致它不会随标题模式切换而隐藏。

修正后的代码 #

struct SomeView: View {
    var body: some View {
        NavigationStack {
            ScrollView {
                ForEach(0..<50) { i in
                    Text("Item \(i)")
                }
            }
            .toolbarTitleDisplayMode(.inlineLarge) // 控制标题滚动时在large/inline间切换
            .navigationTitle("Profile", trailing: {
                // 将按钮放在标题的trailing区域，随大标题一起隐藏
                Image(systemName: "person.circle.fill")
                    .font(.title)
            })
        }
    }
}

原理说明 #

• .toolbarTitleDisplayMode(.inlineLarge)需要应用到滚动视图（或整个导航栈），用来开启“滚动时大标题收缩为inline”的行为。
• 使用iOS 17新增的navigationTitle(_:trailing:)初始化方法，将按钮作为标题的一部分，这样当标题从large切换为inline时，trailing区域的内容会自动隐藏，完美匹配健康/App Store的交互逻辑。
• 如果你仍需要保留其他工具栏项，可以继续添加.toolbar修饰符，这些独立的工具栏项不会随标题模式切换而隐藏。

内容的提问来源于stack exchange，提问作者0x1801ce