4 Comments
User's avatar
Om's avatar

I know this is a really old post, but I just stumbled upon it. Was just trying to understand the weird issue with your circular button, and turns out that "bug" is still here in iOS 26.3. I realized it just stems from trying to use a glassEffect on an element that is already glass, which is probably not so much a bug as it is an implementation detail, haha. You probably found this out already, but sharing just in case someone finds this article now.

Button(action: {

print("Button Pressed")

}) {

Label("Sparkles", systemImage: "sparkles")

.bold()

.foregroundStyle(.white)

.imageScale(.large)

.labelStyle(.iconOnly)

}

.buttonStyle(.glassProminent)

.buttonBorderShape(.circle)

.tint(.red)

.frame(maxWidth: .infinity, maxHeight: .infinity)

.background(Color.blue)

.buttonStyle(.glassProminent) combined with .buttonBorderShape(.circle) yields the expected behavior, and does so relatively elegantly. (Unless the goal was something else and I missed the point entirely, haha)

JD Roodt's avatar

I have a solution for the circular button but it's pretty gross.

If you make your image/label 10 pixels less width than height it expands correctly in the tap animation.

Button(action: {

print("button pressed")

}, label: {

Image(systemName: "xmark")

.font(Font.system(size: 19, weight: .medium))

.frame(width: 50-10, height: 50)

})

.buttonBorderShape(.circle)

.buttonStyle(.glass)

NatashaTheRobot's avatar

I think the danger of that is if they change the pixel ratio in the future, then this will break...

JD Roodt's avatar

Haha 100%! I did say it was gross :D