cornerRadius does not apply to swipeActions in List rows

315 Views Asked by At

I have a list like this:

List {
    ForEach(litters, id: \.id) { litter in
        LitterView(litter: litter)
            .confirmationDialog("Are you sure that you want to delete " + litter.name + " ?",
                                isPresented: $showingLitterDeletionConfirmation,
                                titleVisibility: .visible) {
                Button("Delete " + litter.name, role: .destructive) {
                    deleteLitter(id: litter.id)
                    litters = getAllLitters()
                }
                Button("Annuler", role: .cancel) {}
            }
            .swipeActions(edge:.leading) {
                Button(action: {
                    showingLitterDeletionConfirmation = true
                }) {
                    Image(systemName: "minus.circle")
                }
                .tint(.red)
            }
            .swipeActions(edge:.trailing) {
                Button(action: {
                    litter.clean()
                    litters = getAllLitters()
                }) {
                    Image(systemName: "paintbrush")
                }
                .tint(.green)
            }
            .listRowInsets(EdgeInsets())
            .listRowSeparator(.hidden)
            .cornerRadius(20)
        }
    }
.scrollContentBackground(.hidden)
}

I added a cornerRadius(20) to the LitterView. It applies correctly to the main content of the list row, but if I swipe to show my swipeActions, the corner radius follows the content, and does not apply to the swipe action:

A list of items with a light gray background and rounded corners. The second item has a swipe actions displayed on the right, which does not have rounded corners. The swipe action is in green, and contains a brush icon.

Here is the target I am looking for:

An item block with two swipe actions on the right. The first one has a blue background a 3 dots, and the second one has a red background and a trash can icon. A label below the item says "Inset Group UIContextualAction"

1

There are 1 best solutions below

0
Antonio A. Chavez On

It only applied to .listStyle(InsetGroupedListStyle()) is whats you look for it in the SwiftUI. Also screenshot was make by me.