I have have a View that presents a list that has checkboxes in each row which when tapped they display a checkmark and should add the corresponding the descriptive term to a binding String array. When I tap on the checkbox, the checkmark is displayed but the tap gesture to append the descriptive term is not even reached. If someone could please explain the correct way to call the respective tap gestures.
Here is the code:
NewWineView
struct NewWineView: View {
Button(action: {
descriptorsViewVisible.toggle()
}, label: {
HStack{
Text("Descriptors")
.font(.custom("Oswald-Bold", size: 20))
.foregroundStyle(Color.black)
Spacer()
Image(systemName: "chevron.right")
.foregroundStyle(Color.gray)
}
})
.padding([.leading, .trailing],100)
.padding([.top, .bottom])
}
.sheet(isPresented: $descriptorsViewVisible, onDismiss: {
print(descriptors)
descriptorsViewVisible = false
}, content: {
WineDescriptorsListView(descriptorArray: $descriptors)
})
WineDescriptorsListView
struct WineDescriptorsListView: View {
@EnvironmentObject var model: Model
@Binding var descriptorArray: [String]
var body: some View {
List {
ForEach(model.wineDescriptors, id: \.self) { descriptor in
HStack {
Checkbox()
.onTapGesture {
descriptorArray.append(descriptor)
}
Text(descriptor)
.font(.custom("Oswald-Regular", size: 20))
}
}
}
}
}
Checkbox
struct Checkbox: View {
@State var isChecked: Bool = false
var body: some View {
ZStack {
Rectangle()
.aspectRatio(1.0, contentMode: .fit)
.foregroundStyle(Color.white)
.border(Color.black) //need to make thicker
.frame(width: 30, height: 30)
.onTapGesture {
isChecked.toggle()
}
if isChecked {
Image(systemName: "checkmark")
}
}
}
}
Additionally model.wineDescriptors is just an array of descriptive terms.




