SwiftUI searchable on NavigationView always shown, hides only on scroll

Question

I'm writing a fairly simple SwiftUI app about movies and I have this issue where the new .searchable modifier on NavigationView is always being shown, whereas it should be hidden, unless you pull down on the List.

It hides it correctly if I scroll a bit up, and if I scroll down it also hides it correctly, but other than that, it's always being shown. See gif for clarification. (basically it should behave the same as in Messages app)

https://i.sstatic.net/9t87V.jpg

My code for using the searchable is fairly simple:

var body: some View {
        NavigationView {
            List {
                ForEach(/*** movie stuff ***/) { movie in
                    ///// row here
                }
            }
            .listStyle(GroupedListStyle())
            .onAppear {
                // load movies
            }
            .navigationTitle("Discover")
            .searchable(text: $moviesRepository.searchText, placement: .toolbar, prompt: "Search...")
        }
    }
}

"whereas it should be hidden, unless you pull down on the List" - this is wrong assumption... probably you are confusing it with refresh control. It behaves as designed. — Asperi
– Asperi, Commented Feb 10, 2022 at 21:42
Then I got the wrong impression, I apologise - I'm still new to iOS dev. Is there a way to mimic such search functionality with SwiftUI or with UIKit? — Vedran Kopanja
– Vedran Kopanja, Commented Feb 10, 2022 at 21:53
Your code does exactly what you want and describe on my phone and simulator – search field is hidden until you move list down (Xcode 13.2, iOS 15.2) .. of course I tried with text only, so it might me the cells — ChrisR
– ChrisR, Commented Feb 10, 2022 at 21:58
@Asperi basically I want this functionality. imgur.com/nQVow5h — Vedran Kopanja
– Vedran Kopanja, Commented Feb 10, 2022 at 21:59
@ChrisR well what the heck, I honestly don't understand why isn't it working for me... Does it matter that the entire view is inside a tab view? (basically TabView is hosting 3 views, one of which is the one I posted) edit: nope, I pulled it out and put it as root view, still doesn't work :( — Vedran Kopanja
– Vedran Kopanja, Commented Feb 10, 2022 at 22:01

Vedran Kopanja · Accepted Answer · 2022-02-19 19:12:06Z

So, after adding a progress view above the list view, it suddenly started working the way I want it to. The code now is minimally changed and looks like this.

var body: some View {
    NavigationView {
        VStack {
            if /** we're doing search, I'm checking search text **/ {
                ProgressView()
                    .padding()
            }

            if !movies.isEmpty {
                List {
                    ForEach(/** movies list **/) { movie in
                        // movie row here
                    }
                }
                .listStyle(GroupedListStyle())
                .navigationTitle("Discover")
                .searchable(text: $moviesRepository.searchText, placement: .toolbar,
                            prompt: Text("Search...")
                                .foregroundColor(.secondary)
                )
            } else {
                ProgressView()
                    .navigationTitle("Discover")
            }
        }
    }
    .onAppear {
        // load movies
    }
}

And basically after adding the progress views, it started working the way I described it in my OP and the way it worked for ChrisR

frunny · Accepted Answer · 2023-04-22 07:45:30Z

-5

You can set the displayMode to ".automatic" and it will hidden by default. SearchFieldPlacement.NavigationBarDrawerDisplayMode

List {
...
}
.searchable(text: $searchText, placement: .navigationBarDrawer(displayMode: .automatic))

answered Apr 22, 2023 at 7:45

frunny

411 silver badge5 bronze badges

Collectives™ on Stack Overflow

SwiftUI searchable on NavigationView always shown, hides only on scroll

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related