Button grayed out in toolbar initially

user_16324343 0
Viewed 290

I have a SwiftUI macOS application, and I noticed that when you have a button in a toolbar, its image is initially grayed out until you hover over or click it.

I am using macOS Montery Beta 3, and Xcode 13 Beta 3.

Simple Reproduction

  1. Create a new SwiftUI macOS project
  2. Paste the following code:
struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Panel1").padding()
                .toolbar {
                    Button(action: {}) {
                        Image(systemName: "plus")
                    }
                }
            Text("Panel2").padding()
        }
    }
}
  1. Run the application, and you should see that the plus button is grayed out. However hovering over or clicking it makes the button not gray.

This question is very similar to this, but instead with a toolbar.

Whats happening here?

swiftui swift macos
1 Answers

I had the same issue and discovered that you need to specify the color explicitly.

.toolbar {
    Button(action: {}) {
        Image(systemName: "plus")
    }
    Button(action: {}) {
        Image(systemName: "plus")
            .foregroundColor(.white)
    }
}

Example

user_46985010
Related