Floor Filter uses non-standard close button

[rolson]

trafficstars

The close button in the floor filter looks like this:

However, with Apple's own apps, I see it often like this:

What I've found works well for that look is this code:

            Button {
                dismiss()
            } label: {
                Image(systemName: "xmark.circle.fill")
                    .resizable()
                    .symbolRenderingMode(.hierarchical)
                    .foregroundStyle(.secondary)
                    .frame(width: 28, height: 28)
            }
            .buttonStyle(.plain)

And actually, I think we are already using that in the world scale scene view's calibration view.

You can actually create a predefined dismiss button with something like this:

struct DismissButton: View {
    enum Kind {
        case image
        case text
    }
    
    @Environment(\.dismiss) private var dismiss
    let kind: Kind
    
    init(kind: Kind = .image) {
        self.kind = kind
    }
    
    var body: some View {
        switch kind {
        case .image:
            Button {
                dismiss()
            } label: {
                Image(systemName: "xmark.circle.fill")
                    .resizable()
                    .symbolRenderingMode(.hierarchical)
                    .foregroundStyle(.secondary)
                    .frame(width: 28, height: 28)
            }
            .buttonStyle(.plain)
        case .text:
            Button {
                dismiss()
            } label: {
                Text("Done")
            }
        }
    }
}