I’m creating a custom ButtonStyle, and I want to replicate the iOS button highlighting that occurs on tap. (iOS 17)
(Backstory: I’m using a custom ButtonStyle because I want to apply a minimum width to the button, using a .bordered or .borderedProminent ButtonStyle will produce an incorrect button size, presumably because those styles introduce their own padding, which conflicts with the framing.)
I’ve seen people adjust the button’s opacity and brightness like this:
struct CustomButtonStyle: ButtonStyle {
let backgroundColor: Color = .mint
func makeBody(configuration: Configuration) -> some View {
configuration.label
.frame(minWidth: 240)
.foregroundStyle(.white)
.font(.system(size: 19))
.fontDesign(.rounded)
.fontWeight(.semibold)
.background(backgroundColor, in: RoundedRectangle(cornerRadius: 10, style: .continuous))
.opacity(configuration.isPressed ? 0.8 : 1)
.brightness(configuration.isPressed ? 0.2 : 0)
}
}
Problem: this approach doesn’t provide reliable/usable/readable highlighting across a range of colors. It will work well for a red or dark blue background, but is barely readable with a background color of, say, mint.
Whereas Apple’s highlighting is readable regardless of the color.
Any suggestions?