swipeActions in a list: button can not be pressed-CodePudding

I'm trying to add a simple swipe action to my list. But for some reason the button can not be pressed. When I perform a full swipe it works though.

This is my code:

var listView: some View {
    List {
        ForEach(Array(debits.enumerated()), id: \.element) { index, debit in
            HStack {
                Text(debit.name)
                    .swipeActions(allowsFullSwipe: true) {
                        Button(action: {
                            print("Hi \(index)")
                        }, label: {
                            Image(systemName: "slider.horizontal.3")
                        })
                    }
                Spacer()
                Text(String(debit.value))
                    .frame(width: 70, alignment: .trailing)
                Text("€")
                Divider().padding(.leading, 5)
                Toggle("", isOn: $debits[index].toggle)
                    .onChange(of: debit.toggle) { newValue in
                        calculateAvailable()
                    }
                    .frame(width: 50)
            }
        }
    }.listStyle(.plain).lineLimit(1)
}

Like I said, a press on the button does not print anything but the full swipe does.

CodePudding user response：

Move the .swipeActions modifier to the HStack containing the whole row:

List {
    ForEach(Array(debits.enumerated()), id: \.element) { index, debit in
        HStack {
            Text(debit.name)
                
            Spacer()
            Text(String(debit.value))
                .frame(width: 70, alignment: .trailing)
            Text("€")
            Divider().padding(.leading, 5)
            Toggle("", isOn: $debits[index].toggle)
                .onChange(of: debit.toggle) { newValue in
                    calculateAvailable()
                }
                .frame(width: 50)
        }
        .swipeActions(allowsFullSwipe: true) {
            Button(action: {
                print("Hi \(index)")
            }, label: {
                Image(systemName: "slider.horizontal.3")
            })
        }
    }
}

Also, I would recommend adding a stable id to your Debit structure. Something like this:

struct Debit: Hashable, Identifiable {
    var name: String
    var value: Double
    var toggle: Bool
    let id = UUID()
}

and use that as your id:

ForEach(Array(debits.enumerated()), id: \.element.id) { index, debit in

If you weren’t enumerating to get the index, then you’d simply be able to iterate over debits since the items are Identifiable:

ForEach($debits) { $debit in

CodePudding user response：

This is working fine, the HStack is your problem. Try to set the swipaction on the HStack

List {
    ForEach(YourList, id: \.self) { debit in

            
            Text(debit)
                .swipeActions(allowsFullSwipe: true) {
                    Button(action: {
                        print("Hi \(index)")
                    }, label: {
                        Text("test")
                    })
                }
        }
  }
enter code here