如何创建带有多色标签的SwiftUI菜单？解决符号与文字颜色独立问题

你遇到的问题是因为Menu的label默认会被系统应用统一的前景色，导致单独设置的颜色被覆盖。要实现文字黑色、SFSymbol蓝色的效果，有两种可行方案：

方案1：使用AttributedString构建多色标签 #

直接通过AttributedString分别设置文字和图标的颜色，这种方式能绕过系统的统一样式覆盖：

Menu {
    Button("Title 1", action: {})
    Button("Title 2", action: {})
} label: {
    var attributedString = AttributedString("Share")
    attributedString.foregroundColor = .black
    
    let iconString = AttributedString(Image(systemName: "square.and.arrow.up"))
    iconString.foregroundColor = .blue
    
    Text(attributedString + iconString)
}

方案2：自定义MenuStyle保留标签原有样式 #

通过自定义MenuStyle，让标签的内部颜色设置生效，避免系统统一覆盖：

首先定义自定义的MenuStyle：

struct CustomMenuStyle: MenuStyle {
    func makeBody(configuration: Configuration) -> some View {
        Menu(configuration)
            .labelStyle(.titleAndIcon)
            .foregroundColor(.primary)
    }
}

// 扩展让样式更易调用
extension MenuStyle where Self == CustomMenuStyle {
    static var custom: CustomMenuStyle { .init() }
}

然后使用这个样式：

Menu {
    Button("Title 1", action: {})
    Button("Title 2", action: {})
} label: {
    Text("Share")
        .foregroundColor(.black)
    + Text(Image(systemName: "square.and.arrow.up"))
        .foregroundColor(.blue)
}
.menuStyle(.custom)

两种方案都能实现你要的多色标签效果，方案1更直接，方案2适合需要统一自定义多个Menu样式的场景。

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