SwiftUI List on macOS: highlighting content in the selected row?

Question

In a SwiftUI List, when a row is selected, a blue selection is drawn in the selection, and foreground Text with the default primary color is automatically made white. For other views with custom colors, I'd like to be able to make sure they become tinted white to match the system apps. For example, see the blue dot on the selected row:

Example code:

List(selection: $selection) {
    ForEach(0..<4) { index in
        HStack {
            Image(systemName: "circle.fill")
                .foregroundColor(.blue)
            Text("Test")
        }
        .tag(index)
    }
}

Any tips on how to achieve the correct result here? 🙏

With NSTableCellView, there is the backgroundStyle property, but I couldn't find anything like this.

• I've searched all of the available environment variables, and couldn't find anything appropriate.
• I have also tried manually including an isSelected binding on a view for each row, but the selection binding is not updated by List until mouse-up, while the highlight is updated on mouse-down and drag, so this results in a flickery appearance and is not right either.

I'm also looking to customize not just a single SF Symbol image, but also a RoundedRectangle that is drawn with a custom foreground color that I want to become white upon selection.

Answer 1

Approach

• Use a Label for the cell

Code

struct ContentView: View {
    
    @State private var selection: Int?
    
    var body: some View {
        List(selection: $selection) {
            ForEach(0..<4) { index in
                Label("Test", systemImage: "circle.fill")
                .tag(index)
            }
        }
    }
}

Screenshot