我想做一个视图，其头部区域看起来就像App Store的搜索标签中的那一部分，但我做不到。 我不能使用 .navigationTitle，因为它会随着用户滚动而滚动，并且在滚动时还会折叠成一个内联视图。 我注意到Apple使用的是带有 .searchable 修饰符的同一个搜索栏。 但我不知道他们在滚动时是如何让标题和个人资料图标保持固定的位置。 我尝试过使用 .toolbarTitleDisplayMode(.inlineLarge)，但一旦用户开始滚动，标题仍然会折叠成一个内联视图。 我也尝试把标题文本放在滚动视图上方，但 .searchable 修饰符会自动把该文本移到搜索栏下方。

我的意思是我可以自定义一个（对淡出效果使用 .safeAreaBar(edge:content:)）也许更简单，但我只是想问是否存在实现该外观的原生/投机取巧的方法。 我想让标题、个人资料图标和搜索栏在App Store的搜索标签中保持完全一样的样子。 我已经附上三张不同阶段的图片来说明我的意思。 是否存在实现此效果的原生或投机取巧的方法，还是最好直接自己实现？

图片：

解决方案

尝试使用工具栏项位置 .subtitle。默认是居中对齐，如果你想要左对齐，可以应用一个 .frame 修饰符。

struct ContentView: View {
    @State private var searchText = ""

    var body: some View {
        NavigationStack {
            ScrollView {
                scrolledContent
            }
            .searchable(
                text: $searchText,
                placement: .navigationBarDrawer(displayMode: .always)
            )
            .toolbar {
                ToolbarItem(placement: .subtitle) {
                    Text("Title")
                        .font(.largeTitle)
                        .fontWeight(.bold)
                        .frame(maxWidth: .infinity, alignment: .leading)
                }
            }
        }
    }

    private var scrolledContent: some View {
        VStack {
            ForEach(0..<100) { i in
                let hue = (Double(i) * 13 / 100).truncatingRemainder(dividingBy: 1)
                RoundedRectangle(cornerRadius: 10)
                    .frame(height: 80)
                    .foregroundStyle(Color(hue: hue, saturation: 0.7, brightness: 0.7).gradient)
            }
        }
        .padding()
    }
}