SwiftUI中如何根据布尔值修改MenuBarExtra图标的颜色？

问题描述 #

想要创建一个MenuBarExtra，使其图标能根据布尔值切换不同颜色，替代示例中图标内数字变化的效果。但直接尝试修改Image属性时遇到问题：MenuBarExtra的初始化器要求传入字符串作为systemImage参数，无法直接传入修改过前景色的Image视图。

尝试代码：

MenuBarExtra("label", systemImage: Image(systemName: "circle").foregroundColor(.red))

错误提示：

Cannot convert value of type 'some View' to expected argument type 'String'

解决方法 #

方法1：使用自定义View作为MenuBarExtra图标 #

MenuBarExtra提供了接受自定义View的初始化器，可直接传入带颜色修改的Image，并绑定布尔值动态切换颜色：

@State private var isActive = false

var body: some Scene {
    MenuBarExtra(content: {
        // 菜单栏下拉内容
        Button("Toggle Status") {
            isActive.toggle()
        }
    }, label: {
        Image(systemName: "circle")
            .foregroundColor(isActive ? .red : .gray)
            .font(.system(size: 16)) // 可额外调整图标大小
    })
    .menuBarExtraStyle(.menuAndWindow) // 根据需求选择样式
}

方法2：通过NSStatusItem间接控制（进阶灵活方案） #

如果需要更复杂的图标控制，可直接操作AppKit的NSStatusItem API：

import SwiftUI
import AppKit

@main
struct MenuBarColorApp: App {
    private let statusItem = NSStatusBar.system.statusItem(withLength: NSStatusItem.variableLength)
    
    var body: some Scene {
        Settings {
            EmptyView()
        }
        
        // 隐藏默认MenuBarExtra，用自定义NSStatusItem替代
        MenuBarExtra("", systemImage: "") {
            EmptyView()
        }
        .onAppear {
            setupStatusItem()
        }
    }
    
    private func setupStatusItem() {
        guard let button = statusItem.button else { return }
        button.image = NSImage(systemSymbolName: "circle", accessibilityDescription: nil)
        button.image?.isTemplate = false // 关闭模板模式才能显示自定义颜色
        button.image?.tintColor = .red
        
        // 添加切换颜色的菜单选项
        let menu = NSMenu()
        menu.addItem(NSMenuItem(title: "Toggle Color", action: #selector(toggleColor), keyEquivalent: ""))
        statusItem.menu = menu
    }
    
    @objc private func toggleColor() {
        guard let button = statusItem.button, let image = button.image else { return }
        image.tintColor = image.tintColor == .red ? .gray : .red
        button.image = image
    }
}

说明 #

• 方法1是SwiftUI原生推荐方案，代码简洁，适配大多数常规场景。
• 方法2适合需要复杂自定义（如图标缩放、特殊点击效果）的场景，直接调用AppKit底层API实现。

内容的提问来源于stack exchange，提问作者Bailey