Greetings, I would prefer the search field to be hidden until the search icon is clicked, like it is when the list is scrolled up a bit:

However, at launch and also when I scroll to the top of the list, regardless of visibility setting, I get this:

Please note, I have no commercial aspirations for this app, strictly personal use for a handfull of friends and I. We are learning to live with the search field when it appears as it can be scrolled out of view, but when present it is surprisingly distracting. Many of us, including myself, start typing in the search field to ADD an item, instead of clicking the plus icon.
I confess that I am looking for a quick fix, as I know that custom tab bars and suchlike can eliminate this problem. However, I am not sure I am up to that task. I would most likely just learn to live with it as i am doing now.
Thanks for any help you can provide.
Here is the code:
struct ListView: View {
@Environment(\.modelContext) private var modelContext
@State private var selectedRow: String?
@State private var searchText = ""
@State private var sortOrder = SortDescriptor(\ItemModel.aisle)
@State private var aisleSort = false
@State private var isSearchPresented = false
var body: some View {
Group {
NavigationStack {
ListSubView(searchText: $searchText, sortOrder: $sortOrder)
.listStyle(PlainListStyle())
.navigationTitle("🍆 Groc, Me Out 🌮")
.navigationBarTitleDisplayMode(.inline)
.navigationDestination(for: ItemModel.self) { item in EditView(itemModel: item.self) }
.toolbar {
ToolbarItem(placement: .navigationBarLeading) {
Button("", systemImage: "magnifyingglass") {
isSearchPresented.toggle()
}
.foregroundColor(.secondary)
.labelStyle(.iconOnly)
}
ToolbarItem(placement: .navigationBarTrailing) {
Button("", systemImage: "checkmark.rectangle.stack") {
}
.foregroundColor(.secondary)
.labelStyle(.iconOnly)
}
}
.searchable(text: $searchText, isPresented: $isSearchPresented, prompt: "Find something Groc...")
.autocapitalization(.none)
.autocorrectionDisabled(true)
}
}
}