How to use Swiftui searchable

The SwiftUI searchable () tweak adds a search bar directly to a NavigationView, which will either remain fixed for simple layouts or appear and scroll when used with a list.

Prior to iOS 15, SwiftUI did not have a built-in modifier for handling search in List displays. Developers must provide your own solution. We’ve created a tutorial that teaches you how to utilise TextField in SwiftUI to construct a search bar and display the results. With the release of iOS 15, the SwiftUI framework provides a new searchable enhancement to List displays.

This may be as easy as adding searchable() to some view within a navigation view, as demonstrated below:

The Modifier for SwiftUI Searchable Views

Before we can add search to our list, we need a state variable to contain our search query text:

The.searchable view modification is then applied to our content view. You may apply the change to any content view; you are not limited to utilising it only while searching lists:

    @State private var textSearch = ""

Finally, in response to a change in the query string, we adjust our fetch request to return new results:

NavigationView {
            Text("Searching for \(textSearch)")
                .searchable(text: $textSearch)
        }

Text placeholder

The following prompt is presented in the search area by default:

.searchable(text: $textSearch)

You may override this by inserting the following prompt in the searchable view modifier:

 .searchable(text: $textSearch, prompt: "Search text")

By combining all of the code, we obtain

struct SearchView: View {
    @State private var textSearch = ""

    var body: some View {
        NavigationView {
            Text("Searching for \(textSearch)")
                .searchable(text: $textSearch, prompt: "Search text")
                .navigationTitle("Search Text")
        }
    }
}