Swiftui - Pressing button in a list also actions another button

List(am.students) { item in
	HStack {
		Text(item.name).font(fancyFont)
		Spacer()
		
		Button(item.casual ? "All Paid" : "Reverse All Paid") {
			// Issue: pressing this button also results in Remove button action being invoked.
			item.casual = !item.casual
		}.foregroundColor(Color(white: 0.15))
			.padding(3)
			.overlay(
				RoundedRectangle(cornerRadius: 5)
					.stroke(Color(white: 0.5), lineWidth: 3)
			)
		
		Spacer().frame(width: 40)
		
		Button("Remove") {
			Task {
				await am.delete(student: item)
			}
		}.foregroundColor(Color(white: 0.15))
			.frame(width: 80)
		 .padding(3)
		 .overlay(
			 RoundedRectangle(cornerRadius: 5)
				 .stroke(Color(white: 0.5), lineWidth: 3)
		 )
	}
}

When "All Paid" button is pressed, the "Remove" button action also executes. At a guess, the list row executes everything?

Mark

Answered by Claude31 in 788438022

You have to set buttonStyle (does not work with default value), such as:

.buttonStyle(.borderless)  // Or some other style

So your code:

List(am.students) { item in
	HStack {
		Text(item.name).font(fancyFont)
		Spacer()
		
		Button(item.casual ? "All Paid" : "Reverse All Paid") {
			// Issue: pressing this button also results in Remove button action being invoked.
			item.casual = !item.casual
		}
         .buttonStyle(.borderless)  // <<-- ADD THIS Or some other style
        .foregroundColor(Color(white: 0.15))
			.padding(3)
			.overlay(
				RoundedRectangle(cornerRadius: 5)
					.stroke(Color(white: 0.5), lineWidth: 3)
			)
		
		Spacer().frame(width: 40)
		
		Button("Remove") {
			Task {
				await am.delete(student: item)
			}
		}
         .buttonStyle(.borderless)  // <<-- ADD THIS Or some other style
        .foregroundColor(Color(white: 0.15))
			.frame(width: 80)
		 .padding(3)
		 .overlay(
			 RoundedRectangle(cornerRadius: 5)
				 .stroke(Color(white: 0.5), lineWidth: 3)
		 )
	}
}

You have to set buttonStyle (does not work with default value), such as:

.buttonStyle(.borderless)  // Or some other style

So your code:

List(am.students) { item in
	HStack {
		Text(item.name).font(fancyFont)
		Spacer()
		
		Button(item.casual ? "All Paid" : "Reverse All Paid") {
			// Issue: pressing this button also results in Remove button action being invoked.
			item.casual = !item.casual
		}
         .buttonStyle(.borderless)  // <<-- ADD THIS Or some other style
        .foregroundColor(Color(white: 0.15))
			.padding(3)
			.overlay(
				RoundedRectangle(cornerRadius: 5)
					.stroke(Color(white: 0.5), lineWidth: 3)
			)
		
		Spacer().frame(width: 40)
		
		Button("Remove") {
			Task {
				await am.delete(student: item)
			}
		}
         .buttonStyle(.borderless)  // <<-- ADD THIS Or some other style
        .foregroundColor(Color(white: 0.15))
			.frame(width: 80)
		 .padding(3)
		 .overlay(
			 RoundedRectangle(cornerRadius: 5)
				 .stroke(Color(white: 0.5), lineWidth: 3)
		 )
	}
}

I have the same problem with NavigationLinks (in place of Buttons in the original question). Setting .buttonStyle(.borderless) or .buttonStyle(PlainButtonStyle()) does not fix it. ChatGPT gave me a clear example, which it claimed would work, but just repeats the problem

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                ForEach(0..<10) { index in
                    HStack {
                        NavigationLink(destination: DestinationView1(item: index)) {
                            Text("Navigate to View 1")
                                .padding()
                                .background(Color.blue)
                                .foregroundColor(.white)
                                .cornerRadius(8)
                        }
                        .buttonStyle(PlainButtonStyle()) // Ensure the link only activates on its area

                        Spacer()

                        NavigationLink(destination: DestinationView2(item: index)) {
                            Text("Navigate to View 2")
                                .padding()
                                .background(Color.green)
                                .foregroundColor(.white)
                                .cornerRadius(8)
                        }
                        .buttonStyle(PlainButtonStyle()) // Ensure the link only activates on its area
                    }
                    .padding(.vertical, 5)
                }
            }
            .navigationBarTitle("Navigation Links")
        }
    }
}

struct DestinationView1: View {
    var item: Int

    var body: some View {
        Text("Destination View 1 for item \(item)")
            .navigationBarTitle("View 1", displayMode: .inline)
    }
}

struct DestinationView2: View {
    var item: Int

    var body: some View {
        Text("Destination View 2 for item \(item)")
            .navigationBarTitle("View 2", displayMode: .inline)
    }
}
Swiftui - Pressing button in a list also actions another button
 
 
Q