Daniele D.
Daniele D.

Reputation: 2734

How to colorize black and white SVG loaded with SkiaSharp?

I'm playing with new release of SkiaSharp (1.55) that support loading SVG on Xamarin.Android (and not only). Due to the fact that it was release less than 10 days ago I couldn't find so much documentation.

After loading an SVG in black and white, I'd like to colorize it (changing the foreground filling color from black to any color I need). This is what I'm doing.

using (var paint = new SKPaint())
{
    paint.ColorFilter = SKColorFilter.CreateLighting(SKColors.White, SKColor.Parse("#FF0000"));
}

The above code works fine, but I have the impression that I'm not using the right filter.

  1. Is there any filter with a kind of "colorize" function?
  2. How to achieve the same for background pixels instead?
  3. Any easy way to invert the colors?

Detailed explanations are welcome.

Upvotes: 8

Views: 3163

Answers (1)

Matthew
Matthew

Reputation: 5222

I think the color filter is the correct filter (since you are changing colors), but you can also try using the blend modes instead of lighting:

using (var paint = new SKPaint()) {
    paint.ColorFilter = SKColorFilter.CreateBlendMode(
        SKColors.Red,       // the color, also `(SKColor)0xFFFF0000` is valid
        SKBlendMode.SrcIn); // use the source color

    canvas.DrawPicture(svgPicture, paint);
}

As a result of the blend modes, you can do a whole lot of this, even inverting colors.

Upvotes: 12

Related Questions