SVGView icon indicating copy to clipboard operation
SVGView copied to clipboard

Question: How to apply tint to SVGView?

Open NikSrg opened this issue 2 years ago • 3 comments

Hi. I just started to use SVGView. I need to apply a tint to the svg image. How can I?

I tried unseccessfully:

SVGView(data: data)
                .foregroundColor(.blue)

SVGView(data: data)
                .tint(.blue)

SVGView(data: data)
                .background(Color.blue)

Thanks for any advice.

NikSrg avatar Jan 17 '24 09:01 NikSrg

I have same question as facing the same problem

Zulqurnain24 avatar Jan 19 '24 07:01 Zulqurnain24

+1, me too.

petterobam avatar Feb 19 '24 02:02 petterobam

A bit unintuitive, but I have found a way to apply a "tint" color by masking your SVG on a color. This is also more performant than setting the fill color to every shape via a loop imperatively.

@Zulqurnain24 @petterobam @NikSrg tagging y'all in case you still looking for a solution.

ZStack {
  if let imageData {
    tintColor.mask {
      SVGView(data: imageData)
    }
  }
}

missingems avatar Nov 30 '24 10:11 missingems