SwiftUI 更改 SF Symbol 内部透明部分的颜色

Question

我正在尝试更改名为 delete.left.fill 的 SF Symbol 中透明（透明）部分的颜色。到目前为止我试过如下

Button(action: { return }, label: {
                        Image(systemName: "delete.left.fill")
                            .background(Color.black)
                            //.accentColor(.black)
                            .font(.system(size: self.fontSize*0.75))
                    })
                        .frame(width: self.width, height: self.width)
                        .foregroundColor(.lightGray)
                        //.background(Color.black)

当我运行上面的代码时，结果就像

。

起初，x符号内部的颜色与背景颜色相同。我想让它变黑。

我尝试设置 Button 的 backgroundColor 结果整个 Button 黑色。
我尝试将 Image 的 accentColor 设置为黑色的。没有改变。
我尝试设置 backgroundColor Image 变黑。结果如图所示。

问题是，有没有办法以编程方式使 symbol 内的 x 变黑？

Answer 1

您可以屏蔽背景并应用自定义样式：

struct MyButtonStyle: ButtonStyle {
  public func makeBody(configuration: MyButtonStyle.Configuration) -> some View {
    configuration.label
      .compositingGroup()
      .opacity(configuration.isPressed ? 0.5 : 1.0)
  }
}

Button(action: {}) {
  Image(systemName: "delete.left.fill")
    .foregroundColor(.green)
    .background(
      Color.black.mask(Circle())
    )
}.buttonStyle(MyButtonStyle())

圆圈可能不适合任何用途，但对于这张图片它没问题：

Answer 2

正如他用圆圈警告的那样，@Faruk 的解决方案对 exclamationmark.triangle.fill

对我不起作用

我创建了一个带有填充和未填充版本的 ZStack，以创建一个带有黑色感叹号和黑色边框的黄色三角形：

ZStack{
  Image(systemName: "exclamationmark.triangle")
    .foregroundColor(Color.black)
    .scaleEffect(1.1)
  Image(systemName: "exclamationmark.triangle.fill")
    .foregroundColor(Color.yellow)
}

我只试过几个模拟器，但在 iPadPro 和 iPadMini

上看起来不错

Answer 3

自 iOS 15 起，您只需使用 .foregroundStyle(.red, .blue)

即可实现

SwiftUI 更改 SF Symbol 内部透明部分的颜色

SwiftUI changing the color of clear part inside of SF Symbol

image

swift

swiftui

sf-symbols