I have a Textfield used to name doorways. You tap the textfield and a list is unfolded below with a list of common room names. I can't select an item from the list until after I scroll the list.
Here is my code:
internal var body: some View {
ZStack {
VStack {
HStack { /// the text field
TextField(self.namePlaceholder, text: $viewModel.name)
.onChange(of: viewModel.name) { newValue in
typedRoomName = newValue
}
}
.onTapGesture {
showAutoRoomNames = true
}
if showAutoRoomNames { /// the list of common room names that gets filtered as you type
VStack(alignment: .leading) {
List {
ForEach(RoomNames.getFilteredCommonRoomNames(prefix: typedRoomName), id: \.self) { n in
Text(n)
.onTapGesture {
viewModel.name = n
if showAutoRoomNames {
showAutoRoomNames.toggle()
}
}
}
}
.listStyle(PlainListStyle())
}
}
}
.padding()
.frame(maxWidth: 300)
.zIndex(2.0)
}
}
}
So if I tap the text field, the list of names unfolds, and if I start entering a name I can tap a filtered name. But if I don't start typing a name, I can't select an item from the list until I scroll the list.
The .onTapGesture block in the showAutoRoomNames block does not get hit until after I scroll, I don't know why.
Thanks for any pointers.