I am trying to make a view whose header section looks just like the one used in the App Store’s search tab but I am unable to do so. I can’t use .navigationTitle because it scrolls as the user scrolls and also collapses into an inline view. I notice that Apple uses the same search bar that comes with the .searchable modifier. But I am lost as to how they make the title and profile icon stay in place as the user is scrolling. I have tried using .toolbarTitleDisplayMode(.inlineLarge) but that still collapses the title into an inline view when the user starts scrolling. I also tried putting the title text above the scroll view but the .searchable modifier automatically moves that text below the search bar.
I mean I could make a custom one(using .safeAreaBar(edge:content:) for the fade) and its probably easier but I just wanted to ask if there is a native/hacky way of achieving that look. I want the title and the profile icon and the search bar to be exactly as it is in the App Store’s search tab. I have attached images of the three different stages to show what I mean. Is there a native or hacky way of acheiving this or is it best to just implement my own?
Images:
