Skiasharp: After updating: Interesting issue with SVG on Android

[drewlederman]

Since updating to version 1.57.0 of SkiaSharp, I'm seeing some very weird behavior on Android.

I have an SVG image (rendered here as PNG, attached in original format in zip):

rewards.svg.zip

Loading up the image like so:

var svg = new SKSvg();
svg.Load(stream);

Using SkiaSharp.Views to render it:

protected override void OnPaintSurface(SKPaintSurfaceEventArgs e)
{
    var canvas = e.Surface.Canvas;
    canvas.Clear();
    canvas.DrawPicture(svg.Picture)
}

Results in this image (dark background is the page color):

What's even more interesting is that if I run it by tapping the icon instead of launching it from Xamarin Studio, I get this color:

These color abnormalities have been 100% reproducible in my tests: every time I run it from XS, I get some shade of purple; when I launch it by tapping the icon, I get some shade of green.

Note that it doesn't matter what color the SVG is supposed to be - I always get the same colors after rendering.

I can also confirm that reverting to 1.56.1 resolves the issue.

This only happens on Android, not iOS.

[bmarchionni]

I'm seeing the same behavior at 1.57.0, reverting all Skia libraries to 1.56.1 resolved the issue.

Only on Android

[mattleibow]

Hi @drewlederman and @bmarchionni, unfortunately, I am unable to reproduce this.
I have attached a zip with a sample app that works for me in both Debug and Release, and on both Android and iOS.

Are you able to reproduce your issue with this sample? Or, can you provide a sample that I can investigate?

Are you using any image filters or color filters? Or, maybe you set a blend mode?

Archive.zip

[mattleibow]

Also, I have different colors... They appear to be a plain, darker blue: #0000FF

Here is a screenshot of the svg in chrome:

Here is the same on my device

[drewlederman]

Hi @mattleibow,

Thanks for looking into this. I was able to reproduce the issue with your sample.

Here's a screenshot after being launched by XS:

And here's one after being launched by tapping the launcher icon:

The image didn't appear at all (perhaps transparent?) the first time I launched it by tapping the icon.

The fact that I get reliably different results when launching from XS vs tapping makes absolutely no sense to me, but maybe it's a clue?

The screenshots were taken on XAP Nexus 5 (Lollipop). I also tested with XAP Nexus 7 (Marshmallow) and and XAP Nexus S (KitKat) and got different colors.

If you're still unable to reproduce this, I'd be happy to help any way I can.

Thanks.

[rhussell]

I found the same issue in VS emulator. In android devices it's ok.

[mattleibow]

Ah! That might be it. Are you able to try different emulators? The best ones to try are the ones that come with the Android SDK. If you run them with HAXM, they should be very fast.

Here are some docs to help setup the official emulators:
https://developer.xamarin.com/guides/android/getting_started/installation/accelerating_android_emulators/

These are probably the best to use since, not only can you make use of the Google Play Services, but they are always the latest and most accurate.

[drewlederman]

I'll check it out as soon as I can. Seems weird that older versions of SkiaSharp work fine on the simulator though, doesn't it?

[drewlederman]

Okay, so I tried running your sample again on an emulator created per the instructions you gave and was still able to reproduce...

[mattleibow]

There is something super-weird going on. I changed my sample code to:

canvas.Clear(SKColors.Red);

canvas.Translate(100, 100);

var matrix = SKMatrix.MakeScale(4, 4);
canvas.DrawPicture(svg.Picture, ref matrix);

canvas.DrawRect(SKRect.Create(100, 100, 50, 50), new SKPaint { Color = 0xFF0000FF });

and the background and the rectangle draws fine... it is just the SVG...

[mattleibow]

SKSvg is a thin wrapper that just draws to a SKPicture... So I tried to create my own:

var recorder = new SKPictureRecorder();
var cnv = recorder.BeginRecording(SKRect.Create(0, 0, 100, 100));
cnv.DrawRect(SKRect.Create(20, 20, 60, 60), new SKPaint { Color = 0xFF0000FF });
var pic = recorder.EndRecording();

But that also works fine... Super weird!

[mattleibow]

I found out why this was going all wonky on Android. It may have just been the emulators, or the fact that the emulators were x86 and not ARM.

But, the cause appeared to be with the fact that the C code returned a uint, but then the managed code had a struct.

typedef uint32_t sk_color_t;
sk_color_t sk_paint_get_color(const sk_paint_t*);

public struct SKColor {
    private uint color;
}
public extern static SKColor sk_paint_get_color(sk_paint_t t);

Although this cast appears to work in most cases, it does not for Android, when it is a return type. The reason I want to do this is so that I don't have to keep converting back and forth between a struct and a uint. It should work as they are the same size, but unmanaged return types are a bit more touchy.

This fix is just to change the return types to the UInt32 type, and then do a cast to SKColor or SKPMColor.

[mattleibow]

Just pushed out a release that should resolve this: https://github.com/mono/SkiaSharp/releases/tag/v1.58.1