How to load an svg file in Win2D canvasvirtualcontrol using c# ?

Question

I'm developing an UWP application with Win2D support and I want to load svg file in my CanvasVirtualControl, but I don't know how to convert an svg into RandomAccessStream and how to load svg in CanvasVirtualControl. Really need help. Thanks in advance :)

Answer 1

Hi, DeepakG
Welcome to Microsoft Q&A,

How to load an svg image in win2d (CanvasVirtualControl) using c#?

Win2D contains CanvasSvgDocument class that use to load svg from stream. You could StorageFile OpenReadAsync method to open svg file as stream then call CanvasSvgDocument.LoadAsync method to get svgDocument. For more please refer the the following.

CanvasVirtualControl canvasVirtualControl;
private void Page_Loaded(object sender, RoutedEventArgs e)
{
    canvasVirtualControl = new CanvasVirtualControl();
    canvasVirtualControl.Width = 1486;
    canvasVirtualControl.Height = 610;
    MyCanvas.Children.Add(canvasVirtualControl);
    Canvas.SetLeft(canvasVirtualControl, 0);
    Canvas.SetTop(canvasVirtualControl, 0);
    canvasVirtualControl.RegionsInvalidated += CanvasVirtualControl_RegionsInvalidated;
}

private async void CanvasVirtualControl_RegionsInvalidated(CanvasVirtualControl sender, CanvasRegionsInvalidatedEventArgs args)
{
    CanvasDrawingSession drawingSession;
    Rect rect = new Rect(args.InvalidatedRegions[0].Left, args.InvalidatedRegions[0].Top, args.InvalidatedRegions[0].Width, args.InvalidatedRegions[0].Height);
    using (drawingSession = sender.CreateDrawingSession(rect))
    {
        var file = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets/xxx.svg"));

        using (var stream = await file.OpenReadAsync())
        {
           var svgDocument = await CanvasSvgDocument.LoadAsync(sender, stream);

            drawingSession.DrawSvg(svgDocument, sender.Size);
        }
    }        
}

Thanks
Nico Zhu