3

I'm trying to use SkiaSharp in Xamarin.forms to draw some polygons on top of an image. The image is downloaded from a server and than cached in background. So I would prefer not to manipulate the image itself and instead draw a new canvas and place it in a new view on top of the image, like in the screenshots. (using relative layout) As you can also see in the screenshots, placing the rectangular is not the problem but the "transparent" part is not really transparent.

Code of the first screenshot:

using (var paint = new SKPaint ()) {
  paint.IsAntialias = true;
            using (var path = new SKPath ()) {
                path.MoveTo (0f, 0f);
                path.LineTo (width, height);
                path.LineTo (0, width);
                path.Close ();

                paint.Color = SKColors.Orange;
                canvas.DrawPath (path, paint);

            }
        }

In the second I tried to use

            canvas.Clear(SKColors.Transparent);

but it only changes to the black background.

Does anyone know whether it is possible to have completely transparent parts in a skia view?

Chris
  • 105
  • 1
  • 10

2 Answers2

8

Your question helped me solve this today:

As well as setting the canvas' colour as transparent, the containing Xamarin Forms element needs to be transparent too!

C#
canvas.Clear(SKColors.Transparent);

XAML
<views:SKCanvasView ... BackgroundColor="Transparent" />

huntie
  • 950
  • 9
  • 14
  • Hey that's great to hear.... I was fighting this for a long time and then gave up... but I will definitely try your approach... looks too easy to work properly ;-) – Chris Dec 20 '16 at 15:49
  • You saved my day! Really appreciate it – Bright Lee Jan 09 '17 at 15:21
0

guessing here cause you forgot the screenshots,

what you probably want to do is using clipping

something like :

canvas.Clear();
canvas.ClipPath(path);
canvas.ResetMatrix();
canvas.DrawBitmap(...)
Benoit Jadinon
  • 1,082
  • 11
  • 21