SwiftUI Menu Button Displayed as Disabled Initially

user_3791229 0
Viewed 666

On macOS, SwiftUI Menu buttons appear initially disabled. Once you click on them, they activate as normal and display properly. This code replicates the problem:

Menu {
    Button("First") { }
    Button("Second") { }
} label: {
    Image(systemName: "gearshape.fill")
}
.padding()

Which initially will look like this:

enter image description here

Then after clicking on the button:

enter image description here

  • Preview shows correctly, but a running app behaves as above
  • The contents of the menu don't seem to affect the result
  • Tried explicitly mucking with disabled state using .disabled(false); no joy since it isn't really disabled

I could just set the foreground color of the image, but I was hoping to figure out the real problem. Am I missing something?

EDIT: Setting the foreground doesn't work either. Still visibly disabled.

swiftui macos
1 Answers

This bug (filed as FB8976414) remains as of macOS 11.3. I got some help from @kontiki on a workaround, though. If you include a Button along with the Menu, it displays properly enabled. Don't ask me why. You can make the Button zero-sized so it doesn't affect your layout and just remove it when (if?) the bug gets fixed.

-- Update --

As of macOS 11.4, this technique no longer works. The Menu always displays as disabled until it's clicked. I guess if you look on the bright side, at least it's more consistent!

-- --

HStack(spacing: 0) {
    Menu {
        Button("First") { }
        Button("Second") { }
    } label: {
        Image(systemName: "gearshape.fill")
    }

    Button("", action: {}).scaleEffect(x: 0, y: 0)
}

-- Update 2 --

As of macOS 12.0 according to @Taylor (verified by me in macOS 12.1), the bug is fixed. Thanks, Apple engineers!

user_37912290
Related