How to create searchable picker menu in swiftUI

Question

I am finding to create picker menu with self contain search bar view and once user enter any character as per result of search filter picker menu will automatically reloads in SwiftUI.

Below is the code i tried searchBar is visible in menu list but, After taping on it is closing (behaving like menu selection) instead of focusing in text.

Group { Text("Select Bank") .font(.subheadline) .bold()

Picker("Link Bank Account", selection: $viewModel.selectedAccountProvider) {
                                
SearchBarView(text: $viewModel.searchBarText, placeholderText: "Search")
                                
  ForEach(viewModel.accountProviders, id:\.id) { provider in
     if let providerName = provider.name {
        Text(providerName).tag(provider.id)
        }
     }
  }

.tint(.black)
.pickerStyle(.menu)
.id(viewModel.accountProvidersPickerId)

}

Answer 1

The picker doesn't expect any content that isn't meant to be selected. To get this sort of behaviour, put the search bar view outside of the picker, and handle the modal presentation yourself. e.g

Button(selection.name) {
        isPresentingPicker.toggle()
    }
    if isPresentingPicker {
        VStack {
            searchBarView
            pickerView
                .pickerStyle(.inline)
        }
    }