Search code examples
c#.netuwpwin2d

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


I'm developing an UWP app using Win2D and I want to know how to load an .svg file(present in my application) in Win2D. I don't know how to read the svg file and convert it into RandomAccessStream.


Solution

  • 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, 100);
        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);
            }
        }        
    }